Question

我无法完成最后的工作。我仍然是ajax和json的新手，但这是我到目前为止所拥有的。我试图从一个php文件中获取一个数组，并通过ajax / json将它们加载到一个选择下拉列表（#input）中。我觉得我很接近，但我不确定我在哪里弄乱。请帮忙

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">

<script src="../_js/jquery-1.7.2.min.js"></script>

<script>
$(document).ready(function() {

if ($("#numbers").val() == "2") {
        $.ajax({
            type: 'POST',
            url: 'login.php',
            data: 'id=testdata',
            dataType: 'json',
            cache: false,
            success: function(result) {
                var numbers = <?php echo json_encode($array); ?>;
                for (i=0;i<numbers.length;i++){
                    $('#input').append("<select>" + numbers[i] + 
"</select>");
                }           
            },

        });
} 

});
</script>

</head>
<body>
<div class="wrapper">
    <div class="header">
    </div>
    <div id="content">
        <div class="main">
            <div id="formwrapper">


        <select id="numbers">
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
        </select>
        <select id="input"></select>


</div>
        </div>
    </div>

</div>
</body>
</html>

这是我的PHP（login.php）

<?php
$array = array(1,2,3,4,5,6);
echo json_encode($array);
?>

Answer 1

在您的脚本中，您没有对从AJAX调用返回的数据做任何事情。我怀疑那是因为你不明白AJAX是如何工作的。我会尝试解释它，而不是深入细节。

当您对URL进行AJAX调用时，您正在发出HTTP请求，就像在Web浏览器中键入http://www.google.com一样。作为响应，该URL另一端的服务器向您发送带有一些数据的HTTP响应。

对于你的AJAX，你正在请求login.php的回复，我认为这是你在上面的问题中添加的PHP。在success函数中，您获得result。 result是由login.php输出的所有内容。

所以，

$(document).ready(function() {
    $("#numbers").change(function(e) {
        if ($(this).val() == "2") {
            $.ajax({
                type: 'POST',
                url: 'login.php',
                data: 'id=testdata',
                dataType: 'json',
                cache: false,
                success: function(result) {
                    var numbers = result; //result is equal to your array from the php. You don't put PHP here.
                    $('#input option').remove(); //Remove any existing options.
                    for (i=0;i<numbers.length;i++){
                        $('#input').append("<option>" + numbers[i] + "</option>");
                    }           
                }
            });
        }
    });
});

如果login.php不是您上面添加的PHP，那么在您告诉我来自哪个文件之前，我将无法帮助您。

另外，请注意我们将AJAX调用包装到#numbers选择框中的更改事件中。这样，当选择框的值改变时，它将调用此AJAX，并选择数字。

感谢你帮助tymeJV。

将PHP数组加载到html中作为选择选项

1 个答案: