Question

所以我有2个功能，1个绘制图表，另一个绘制表格。我做了一个

<body onload="getchart();gettable();">

但只有表格会被拉出来！所以，我做了一个

<body onload="gettable();getchart();">

但相反，只有图表被抽出来了！

我可以知道如何绘制图表和表格载荷吗？谢谢〜我的代码下面（我没有在这里将服务器端php包含到mysql代码中）：

<script type="text/javascript">
    function gettable(string,strings)
{
var a=string;
var b=strings;
if(a == null && b == null)
{
a = new Date().getFullYear();
b = "";
}

    if (window.XMLHttpRequest) {
        // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    } else {
        // code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            document.getElementById("inputtable").innerHTML =     xmlhttp.responseText;
        }
    };

    xmlhttp.open("GET","GetTableData.php?q="+a+"&v="+b,true);

    xmlhttp.send();
        }

 function getchart(str)
        {
var b=str;
if(b == "")
{
b = new Date().getFullYear();
}
    if (window.XMLHttpRequest) {
        // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    } else {
        // code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            document.getElementById("inputchart").innerHTML = xmlhttp.responseText;

            var a=JSON.parse(xmlhttp.responseText);


            ab=a[1];
            cd=a[2];
            ef=a[3];
            gh=a[4];

            //google.setOnLoadCallback(drawMouseoverVisualization());
            drawMouseoverVisualization();

        }
    };

    xmlhttp.open("GET","getData.php?q="+b,true);
    xmlhttp.send();
}


    function drawMouseoverVisualization() {
      var barsVisualization;
      var data = new google.visualization.DataTable();

      data.addColumn('number', 'Quarter');
      data.addColumn('number', 'Frequency');
      data.addRows([[1,ab],[2,cd],[3,ef],[4,gh]]);


      var options={
          hAxis: {title: 'Quarter'},
          vAxis: {title: 'Frequency'},
          trendlines: {0: {type: 'exponential', //type: 'polynomial',type: 'linear'
                            degree:3,
                           color: 'red'      
            }}
      };

      barsVisualization = new google.visualization.ScatterChart(document.getElementById('chart'));
      barsVisualization.draw(data, options);

    };
    google.load('visualization', '1.0', {'packages':['corechart']});


            </script>
</head>

<body onload="getchart();gettable();">

    <div id="inputchart" style="visibility: hidden"></div>

    <form>
        <select name="years" id="years" onchange="getchart(this.value)">
            <?php
            echo "<option>Select year</option>";
            for ($i=2016;$i<date("Y")+10;$i++){
            echo "<option value='$i'>$i</option>";
            }
            ?>
        </select>
    </form>
           <div id="chart"></div>


    <form>
        <input type="text" name="search" id="search" onkeyup="gettable(year.value,this.value)">
        <select name="year" id="year" onchange="gettable(this.value,search.value)">
            <?php
            echo "<option value=2016>Select year</option>";
            for ($i=2016;$i<date("Y")+10;$i++){
            echo "<option value='$i'>$i</option>";}
            ?>
        </select>

</form>
     <div id="inputtable"></div>


</body>

Answer 1

您正在使用xmlhttp作为全局变量。

您运行的第二个函数将覆盖您分配给它的第一个值。

避免使用全局变量。使用局部变量。添加var。

Answer 2

也许你需要在调用这两个函数之间留一个空格。

http://www.htmlgoodies.com/beyond/javascript/article.php/3724571/Using-Multiple-JavaScript-Onload-Functions.htm

否则，你可以在你的js中创建一个如下所示的函数：

function start () {func1(); func2();}

只需在加载body时调用start（）。

为什么我的表出现在onload而不是我的图表？

2 个答案: