Question

我遇到的问题是部分借用的脚本和我自己的部分，javascript和php填充了两个下拉列表，第二个选项取决于用户在第一个选择的内容。出于某种原因，当在第一个选项中选择初始选项时，无论是在页面加载还是手动选择（如果选项为'a，b，c，d，e），它都不会在第二个下拉列表中加载选项......等等，它不会为'a'加载任何东西。）

我认为它可能与javascript文档就绪函数有关，但我担心我对javascript知之甚少。这是javascript代码：

        $(document).ready(function () {
    $.getJSON("getOutcome.php", success = function(data)
    {
        var options = "";

        for(var i = 0; i < data.length; i++)
        {
            options += "<option value ='" + data[i].toLowerCase() + "'>" + data[i] + "</option>";
        }

        $("#slctOutcome").append(options);

        $("#slctProxy").change();
    });

    $("#slctOutcome").change(function()
    {   
        $.getJSON("getProxies.php?outcome=" + $(this).val(), success = function(data)
    {
            var options = "";

            for(var i = 0; i < data.length; i++)
            {
                options += "<option value ='" + data[i].toLowerCase() + "'>" + data[i] + "</option>";
            }

            $("#slctProxy").html("");
            $("#slctProxy").append(options);

        });

    });
});

Answer 1

更改事件仅在选择更改时触发 - 而不是在填充时触发; - ）

尝试在前一行添加$("#slctOutcome").trigger("change");

玩得开心： - ）

Answer 2

尝试以下方法。在第一个函数中没有调用第二个函数。

 $(document).ready(function () {
$.getJSON("getOutcome.php", success = function(data)
{
    var options = "";

    for(var i = 0; i < data.length; i++)
    {
        options += "<option value ='" + data[i].toLowerCase() + "'>" + data[i] + "</option>";
    }

    $("#slctOutcome").append(options);

    $("#slctOutcome").change();  //<-Here
});

$("#slctOutcome").change(function()
{   
    $.getJSON("getProxies.php?outcome=" + $(this).val(), success = function(data)
{
        var options = "";

        for(var i = 0; i < data.length; i++)
        {
            options += "<option value ='" + data[i].toLowerCase() + "'>" + data[i] + "</option>";
        }

        $("#slctProxy").html("");
        $("#slctProxy").append(options);

    });

});

}）;

javascript / php不会为依赖下拉列表中的第一个选项加载数据

2 个答案: