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

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

ajax json

Ajax 将PHP数组作为选择选项加载到html中,ajax,json,Ajax,Json,我很难完成这项工作。我对ajax和json还是相当陌生的，但以下是我目前掌握的内容。我试图从一个php文件中获取一个数组，并通过ajax/json将它们加载到一个select下拉输入中。我想我已经很接近了，但我不确定我把事情搞砸了。请帮忙 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script src="../_js/jquery-1.7.2.min.js"></

我很难完成这项工作。我对ajax和json还是相当陌生的，但以下是我目前掌握的内容。我试图从一个php文件中获取一个数组，并通过ajax/json将它们加载到一个select下拉输入中。我想我已经很接近了，但我不确定我把事情搞砸了。请帮忙

<!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);
?>

在脚本中，您没有对AJAX调用返回的数据进行任何处理。我怀疑这是因为您不了解AJAX是如何工作的。我会尽量不深入细节地解释它

当您对URL进行AJAX调用时，您正在进行HTTP请求，就像您在web浏览器中键入内容一样。作为响应，URL另一端的服务器向您发送一个包含一些数据的HTTP响应

对于AJAX，您请求的是login.php的响应，我假设它就是您添加到上述问题中的php。在success函数中，您将得到一个结果。这个结果就是login.php输出的所有内容

所以

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

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

谢谢你的帮助。

发生了什么你没有预料到的事情？另外，看起来你根本不懂AJAX。它不应该是$input.append+numbers[i]+；你说得对。我只是用他在那个街区的东西。现在已修复。在成功函数的末尾还有一个尾随：我也怀疑if块是错误的，但我不确定他在那里试图实现什么。我只是在看……如果默认的选定选项未设置为2，则此代码将永远不会运行。我假设OP希望它嵌套在一个变更事件中。

$(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>");
                    }           
                }
            });
        }
    });
});