小编典典

将jQuery UI小部件应用于Ajax加载的元素

ajax

我想在给定的选择器上激活jQueryUI按钮小部件,让我们说“ .button”。

通过ajax加载初始页面后,在插入DOM的任何新“ .button”元素上自动激活窗口小部件的最佳方法是什么?

以前,我将livePlugin与以下代码一起使用:

$('.button')
    .live(function(){
        $(this).button();
    })

由于“实时”已移至jQuery核心,因此实时函数需要将事件类型作为第一个参数,因此不再可行。jQuery核心中是否有替代方法可以实现这一目标?


阅读 238

收藏
2020-07-26

共1个答案

小编典典

您在这里有一些选择。首先,有一个liveQuery插件,如下所示:

$(.button).liveQuery(function() { $(this).button(); });

另一种选择是在加载元素时调用选择器,例如,这.button 在响应中找到所有选择器,因此在ajax调用之前不会与现有元素混淆:

$.ajax({
   url: 'page.html'
   success: function(data) {
     //stuff...
     $('.button', data).button();
   }
});

如果您有很多事情要做,另一种类似的方法是让您的插件具有以下功能:

function rigUI(context) {
  $('.button', context).button();
  $('.date', context).datepicker();
}

$(rigUI); // Load at document.ready, default context is document

//in ajax load love above call: rigUI(data);
2020-07-26