Question

我有一个下拉列表，需要使用json文件中的内容填充。我有一个php文件，可以解析这个json文件并回显所需的输出。

这是我的json，

<?php
        $filecontents = file_get_contents('users.txt');

        $jsonIterator = new RecursiveIteratorIterator(new RecursiveArrayIterator(json_decode($filecontents, TRUE)),RecursiveIteratorIterator::SELF_FIRST);

        foreach ($jsonIterator as $key => $val) {
                if(!is_array($val) && $key == "templatename"){
                        echo '<option>'.$val.'</option>';
                }
        }
?>

这是我的html页面，

<script>
         window.onload = function() {
              loadTest();
         };

        function loadTest()
        {
                var xmlhttp=new XMLHttpRequest();
                document.getElementById("testdropdown").innerHTML=xmlhttp.responseText;

                xmlhttp.open("get","2test.php",true);
                xmlhttp.send();
        }
</script>


<select name="test dropdown" id="testdropdown"></select>

我制作的ajax查询似乎不起作用。

这是我的php文件的输出，

<option>1-1</option><option>1-2</option>

Answer 1

在页面加载时，在<script>标记内添加以下内容之一以调用loadTest（）：

如果你使用jQuery：

$(document).ready(function() {
    loadTest();
});

否则：

window.onload = function() {
    loadTest();
};

Answer 2

原来我错过了几行代码，

            var xmlhttp=new XMLHttpRequest();
            xmlhttp.onreadystatechange=function()
            {
                    if (xmlhttp.readyState==4 && xmlhttp.status==200)
                    {
                            document.getElementById("testdropdown").innerHTML=xmlhttp.responseText;
                    }
            }
            xmlhttp.open("get","2test.php",true);
            xmlhttp.send();

这似乎解决了这个问题。

在页面加载期间使用Ajax函数调用填充html下拉列表

2 个答案: