0

希望这是有道理的......

我有一个加载对话框的页面。对话框的外壳实际上驻留在主页的 HTML 中 (display:none)。在对话框中,我通过以下调用加载了部分视图。

$('.partial').load(url, function (html) { $('.partial')[0].value = html; });

这个局部视图有两个选择框。当第一个被更改时,第二个应该通过 .getJason 调用填充。那个电话在下面。

$.getJSON(url, function (result) {
    var dropList = $("#select");
    var options = "";
    $.each(result, function () {
        options += '<option value="' + this.ID + '">' + this.Name+'</option>';
    });

    $("#select2").empty().append(options); // doesn't work located on the partial view
    $("#test2").empty().append(options); // works located on main page
});

.getJason 调用是通过带有 onChange="populateSecondSelect()" 的函数调用的,因为局部视图是在页面初始加载后加载的(.on 在这种情况下不起作用)。

问题是我试图将选项加载到第二个选择中的部分。jQuery .append 无法识别该元素。我知道这些调用正在工作,因为当我尝试在主页上的“Test2”中加载值时它可以工作。

如何让 jQuery 识别要在加载的局部视图上添加 .append 的元素?

4

2 回答 2

1

您是正确的,on如果稍后加载内容,通常该方法将不起作用。但是,该on方法可以直接附加到document对象,这允许事件附加到选择器,即使它们尚未添加到 DOM。

$(document).on("change", "#select", populateSecondSelect);

虽然需要此方法将事件绑定到动态加载的元素,但只需选择一个元素并附加 html 即可按预期工作。我怀疑您的代码中的其他地方可能存在问题。尝试发布一个更完整的代码示例的JSFiddle

于 2013-05-11T02:01:29.533 回答
0

好的,我想出了一个解决方法。这个想法是我需要填充第二个选择框,因为我需要将它与 docuemnt.on 调用绑定,所以我在实际的选择语句中使用了 mousedown。

$(document).on("mousedown", "#select2", function (){
    if(options != "") {  // that options is "global"
        $(this).empty().append(options);
        options = "";
    }      
});

这完全填充了它。太好了,耶!现在,问题是第二个选择选项将在第一个选择项更改时显示。我想这将不得不这样做。:(

于 2013-05-11T06:35:55.073 回答