Question

以下是一些有效的代码。 HTML是一个简单的选择元素。该脚本使用来自调用的JSON数据填充它。

home.html的：

<html>
<body>
    <div id="id01"></div>
    <select id="machines"></select>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script src="test.js"></script>
    <script>
        var xmlhttp = new XMLHttpRequest();
        var url = "blahblahblah.com/api/getmachinetypes";

        xmlhttp.onreadystatechange = function() {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                var myArr = JSON.parse(xmlhttp.responseText);
                myFunction(myArr);
            }
        };
        xmlhttp.open("GET", url, true);
        xmlhttp.send();

        function myFunction(arr) {
            var i;
            for(i = 0; i < arr.length; i++) {
                $('#machines').append('<option value=' + arr[i].Id + '>' + arr[i].Name + '</option>');
            }
        }

    </script>
</body>

但是，当我删除脚本并将其放在test.js中时，选择列表不再填充。这是为什么？

home.html的：

<html>
<body>
    <div id="id01"></div>
    <select id="machines"></select>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script src="test.js"></script>
</body>

test.js：

var xmlhttp = new XMLHttpRequest();
var url = "blahblahblah.com/api/getmachinetypes";

xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
        var myArr = JSON.parse(xmlhttp.responseText);
        myFunction(myArr);
    }
};
xmlhttp.open("GET", url, true);
xmlhttp.send();

function myFunction(arr) {
    var i;
    for(i = 0; i < arr.length; i++) {
        $('#machines').append('<option value=' + arr[i].Id + '>' + arr[i].Name + '</option>');
    }
}

Answer 1

尝试：

var xmlhttp = new XMLHttpRequest();
var url = "blahblahblah.com/api/getmachinetypes";

function myFunction(arr) {
        var i;
   for(i = 0; i < arr.length; i++) {
        $('#machines').append('<option value=' + arr[i].Id + '>' + arr[i].Name + '</option>');
    }
}

xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
        var myArr = JSON.parse(xmlhttp.responseText);
        myFunction(myArr);
    }
};
xmlhttp.open("GET", url, true);
xmlhttp.send();

简单脚本仅在放置在HTML中时起作用

1 个答案: