Question

我想同时卸载我的init()函数和图形（这是一个窗口onload函数，但不会加载我的图形。

代码

<!DOCTYPE html>
<html>

<head>
  <title> Challenge </title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
  <link rel="stylesheet" href="Css/ChallengeStyle.css" type="text/css"/>
  <script src="Js/Challenge.js"></script>
  <script src="lib/easeljs-NEXT.combined.js"></script>
  <script src="lib/tweenjs-0.5.1.min.js"></script> 
  <script type="text/javascript" src="package/canvasjs.min.js"></script>
  <script type="text/javascript"> 
    window.onload = function () {
      var chart = new CanvasJS.Chart("chartContainer", {            
        title:{
        text: "Running Challenge - 18/05 - 24/05"             
        },

          data: [{      
            type: "column",
            name: "Osman",
            dataPoints: [
              { label: "Osman", y: 220 },
              { label: "Osman", y: 440 },
              { label: "Osman", y: 660 },                                    
              { label: "Osman", y: 880 },
              { label: "Osman", y: 1100 },
              { label: "Osman", y: 1320 },
              { label: "Osman", y: 1540 }
            ]
          },{ 
            type: "column",
            name: "Simon",                
            dataPoints: [
              { label: "18/05", y: 190 },
              { label: "19/05", y: 405 },
              { label: "20/05", y: 610 },                                    
              { label: "21/05", y: 790 },
              { label: "22/05", y: 960 },
              { label: "23/05", y: 1100 },
              { label: "24/05", y: 1310 }
            ]}]
  });
    chart.render();
  }
  </script>
</head>

<body onload="init()" style="margin:0px">
  <canvas id="canvas" width="1347" height="900" style="border: black solid 1px"></canvas>

  <div id="menuContainer">
    <h5>.</h5> 
    <button onclick="location.href='Forsiden.html'"class="btn forsiden"> Forsiden </button>
    <h1>––––––––––</h1>
    <button onclick="location.href='Profil.html'" class="btn profil"> Profil </button>
    <h2>––––––––––</h2> 
    <button onclick="location.href='Challenge.html'"class="btn Challenges"> Challenges </button>
    <h3>––––––––––</h3>
    <button onclick="location.href='Information.html'" class="btn information"> Information </button>
    <h4>––––––––––</h4>
    <button class="btn voresApp"> VoresApp </button>
  </div>

<div id="chartContainer"></div>

</div>

</body>

</html>

您不能使用onload方法调用两个函数吗？我假设它与createjs有关，因为它加载了init函数，但随后将不加载图形。如果我删除了onload初始化，图形将载入其中。

Answer 1

这与createJs无关。 window.onload和body.onload是使用同一事件的方式。在您的代码中，您正在重新定义onload函数。在代码的前面，您定义了窗口加载功能。并且body onload属性覆盖相同的事件处理程序。因此，只有后者才有效。如果您想一次使用多个功能，则主要的onload函数应全部调用它们。

例如

window.onload = function(){
...
    initOne();
    initTwo();
...
}

无法使用窗口onload方法加载我的图形

1 个答案: