jQuery，填充下拉列表

jQuery, Filling DropDown list

本文关键字：下拉列表 填充 jQuery      更新时间：2023-09-26

我的页面上有 2 个下拉列表在循环中动态创建（1 到 2），在更改事件 1 （onChange= fillDropDown(this, <%=i%>); ） 时，我正在尝试填充第二个下拉列表。 代码如下：

function fillDropDown(control, id) {
    var ddllist = $("#dropDownList"+ id); // Debug : OK 
    var url = "GetData.asp?param=" + $(control).val(); // Debug : OK
    $.getJSON(url, function (data){
        $.each(data, function(){
            // database call is successful, I had alert here to display the data rows.
            ddllist .append($("<option />").val(this.ID).text(this.Name));
        });
    });
}

我之前使用纯 JS 通过使用 document.getElementById("dropDownList" + id) 获取元素，然后在 for 循环中创建一个新元素 （option），用数据分配其 innerHTML 和值属性，最后将此元素附加到下拉ddlInstType.appendChild(element)。这工作正常，但仅在IE中。由于某些原因，此解决方案在Firefox和Chrome中不起作用。我也尝试在页面底部移动脚本，但仍然没有。

这个问题之前可能已经在这里讨论过多次，我确实搜索了可能的答案，但无法解决我的问题。我不确定我做错了什么。

提前感谢您，如果您需要更多信息，我会及时提供。

PS：没有抛出错误，它根本没有做任何事情。我的第二个下拉列表仍然是空的。

编辑2：

由于原始代码是由其他人编写的，因此第二个下拉列表缺少 ID 属性，仅分配了 name 属性。添加了与名称相同的ID属性，现在效果很好。出于一些奇怪的原因，document.getElementById（）在IE中工作，甚至你的ID也不在那里。但在Chrome和Firefox中不起作用。而且因为它在IE中工作，所以我有点忽略了语法错误的可能性。

如果不看到所有代码，就很难模拟问题。我的一个应用程序中也有类似的功能。

    //Extract from ajax function
    $.each(data.d, function (index, element) 
       {
        users += "<option data-u-i='" + element.uid + "'>" + element.firstName + " " +     
                  element.lastName + "</option>";
       });

然后我将用户变量传递到下拉列表中：

$('.dropdown').html(users);

希望这有帮助。

问候

相关文章：