将jQueryUI小部件应用于ajax加载的元素

我想激活给定选择器上的jQueryUI按钮小部件，比如“.button”

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

之前，我使用livePlugin的代码如下：

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

$(.button).liveQuery(function() { $(this).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);

---

由于'live'已移动到jQuery核心，因此live函数需要一个事件类型作为第一个参数，因此这不再可能。jQuery核心中是否有其他方法可以实现这一点？

这里有几个选项。首先，有这样的问题：

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

$(.button).liveQuery(function() { $(this).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);

另一种选择是在加载元素时调用选择器，例如，在响应中只查找所有

.button

，这样在ajax调用之前不会弄乱现有元素：

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

如果你有很多事情要做，另一个类似的方法是让你的插件具有如下功能：

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

$(.button).liveQuery(function() { $(this).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);

---

由于所有jquery命令都具有统一的结构，因此使用任何对象（包括来自ajax请求的json数据）作为jquery命令非常容易

样本：

var jc = {
    'selector': '#sample',
    'method': 'dialog',
    'options': {'title': 'I am a sample'}
}

$(jc.selector)[jc.method](jc.options);

与

对话框（{'title'：“我是一个样本}）

---

liveQuery的替代方案，因为我觉得它已经过时了，因为我无法让它工作：

• 您需要将所有jquery激活声明为*$（“body”）.build（function（）{}）；*语句
• 您需要调用$（“newelement”）.build（）；以回调所有初始化函数

查看jquery.build网站上的文档，了解更多信息和示例，以及与您的案例类似的实时演示

---

谢谢，我曾考虑过使用liveQuery插件，但第二种方法似乎效率更高！