个人中心
gpt4 book ai didi

javascript - 导入的文件未定义

转载 作者：行者123 更新时间：2023-11-28 08:13:55 29 4
gpt4 key购买 nike

解决方案我的问题是在对 HTML 和 JavaScript 知之甚少的情况下提出的，对此我深表歉意。随着更多的经验，我可以清楚地看到这不是一个好问题，无论如何我的问题的解决方案只是源文件不在相应的库中。

问题是，当我点击 IDE 括号中的“实时预览”时，我可以看到我创建的动态图，但是当我双击 index.html 文件时，它显示了导航栏，但没有动态图表....所以区别是:- 实时预览:显示带有动态图表的导航栏- 双击 index.html:只显示导航栏而不显示动态图表....?

顺便说一句:我也在本地主机上用 xamp 测试了这个，同样的问题没有动态图表......

这是我的代码:index.html:

<!DOCTYPE html>
<html>
<head>
    <!-- Unable to zooming device -->
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

      <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">

    <!-- Optional theme -->
    <link rel="stylesheet" type="text/css" href="css/bootstrap-theme.min.css">

    <!-- Initialize jquery -->
    <script src="js/jquery-2.1.3.min.js"></script>

    <!-- Latest compiled and minified JavaScript -->
    <script src="js/bootstrap.min.js"></script>    

    <!-- Link to stylesheet bootstrap.css -->
    <link rel="stylesheet" type="text/css" href="css/bootstrap.css"> 

    <!--Live Random Data -->
    <script type="text/javascript">
    window.onload = function () {

        var dps = []; // dataPoints

        var chart = new CanvasJS.Chart("chartContainer",{
            title :{
                text: "Live Random Data"
            },          
            data: [{
                type: "line",
                dataPoints: dps 
            }]
        });

        var xVal = 0;
        var yVal = 100; 
        var updateInterval = 20;
        var dataLength = 500; // number of dataPoints visible at any point

        var updateChart = function (count) {
            count = count || 1;
            dataPoints.

            for (var j = 0; j < count; j++) {   
                yVal = yVal +  Math.round(5 + Math.random() *(-5-5));
                dps.push({
                    x: xVal,
                    y: yVal
                });
                xVal++;
            };
            if (dps.length > dataLength)
            {
                dps.shift();                
            }

            chart.render();     

        };

        // generates first set of dataPoints
        updateChart(dataLength); 

        // update chart after specified time. 
        setInterval(function(){updateChart()}, updateInterval); 

    }
    </script>
    <script type="text/javascript" src="/canvasjs/canvasjs.min.js"></script>


</head> <!-- End header-->

<body>

<nav class = "navbar navbar-default">
  <div class="container-fluid">

      <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"> </span>
        <span class="icon-bar"></span>
      </button>
      <a style = "color:red;"class="navbar-brand" href="#">KPEC</a>
    </div>

    <!-- Collect the nav links, forms, and other content for toggling -->
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav">
        <li><a href="#"><span class="glyphicon glyphicon-home" style="font-size:25px;" aria-hidden="true"></span></a></li>
        <li><a href="#"><span class="glyphicon glyphicon-edit" style="font-size:25px;" aria-hidden="true"></span></a></li>
        <li><a href="#"><span class="glyphicon glyphicon-stats" style="font-size:25px;" aria-hidden="true"></span></a></li>
      </ul>

      <ul class="nav navbar-nav navbar-right">
        <li><a href="#"><span class="glyphicon glyphicon-list-alt" style="font-size:25px;" aria-hidden="true"></span></a></li>
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><span class="glyphicon glyphicon-cog" style="font-size:25px;" aria-hidden="true"></span><span class="caret"></span></a>
          <ul class="dropdown-menu" role="menu">
            <li><a href="#">5</a></li>
            <li><a href="#">6</a></li>
            <li><a href="#">7</a></li>
            <li class="divider"></li>
            <li><a href="#">8</a></li>
          </ul>
        </li>
      </ul>

    </div><!-- /.navbar-collapse -->
  </div><!-- /.container-fluid -->
</nav><!-- end navbar -->

    <!--Window Size Of Realtime Data-->
    <div id="chartContainer" style="height: 300px; width:100%;"></div>

</body> <!-- End body-->

</html><!-- End html-->

最佳答案

我认为你的依赖路径不正确，有时你是相对的，有时不是。试着把绝对的放在相对的？例如替换

<script type="text/javascript" src="/canvasjs/canvasjs.min.js"></script>

到

<script type="text/javascript" src="canvasjs/canvasjs.min.js"></script>

关于javascript - 导入的文件未定义，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29104372/

29 4 0
文章推荐： swift - 为什么自己没有解决？
文章推荐： c# - 如何在 XP 下工作的 C# 代码中使用 c++ dll？
文章推荐： javascript - 如何让这个javascript同时在IE7和chrome中运行
文章推荐： c++ - 如何在 XCode 4 中将旧式构建日志设置为默认构建错误 View
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com