如何在页面更新时执行 jquery

Question

我使用 jquery multi-select 以用户友好的方式呈现我的 django 应用程序 muslitiselect。当我的页面首次渲染时，我在页面上放置了下面给出的脚本，该脚本将任何具有类多选的元素绑定到 jquery 多选。

$(function() {
      $(".multiselect").multiselect();
     }
);

现在我已经渲染了几个 div，当用户点击编辑页面查询时，使用有界表单渲染这些 div。

function inline_modal_form(href, data) {
        url = '.';
        modal_link = '#' + String(href);
        $(modal_link).load(url, data);
    }

现在，当呈现的新表单具有具有类多选的元素时，但无法与 jquery 多选绑定。我的页面更新时如何执行此脚本。

我已经搜索过 .on(previously .live, .delegate) 之类的方法，但无法理解如何执行我的脚本。

jQuery 1.8

Answer 1

不要直接在根代码中调用插件，而是将其包装在一个函数中并调用它：

var bindMultiselects = function () {
    $(".multiselect").multiselect();
};

$(function() {
    bindMultiselects();
    // any other page load code, etc.
});

然后，当您加载新内容时，再次调用该函数：

function inline_modal_form(href, data) {
    url = '.';
    modal_link = '#' + String(href);
    $(modal_link).load(url, data, bindMultiselects);
}

当然，这仅在初始化插件的行为在调用两次时没有副作用的情况下才有效。它不应该，但我不能确定。如果是这种情况，那么您将需要一个比 ".multiselect" 更好的选择器，因为您只需要区分刚刚动态添加的元素，而不是已经使用插件初始化的元素。

Answer 2

没有插件委托，委托用于事件绑定。

在你的情况下，你应该使用加载回调函数：

function inline_modal_form(href, data) {
    url = '.';
    modal_link = '#' + String(href);
    $(modal_link).load(url, data, function () {
        $(modal_link).find('.multiselect').multiselect();
    });
}