Question

我想激活给定选择器上的jQueryUI按钮小部件，让我们说'.button'。

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

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

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

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

Answer 1

这里有几个选项。首先，有liveQuery plugin，就像这样：

$(.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);

Answer 2

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

样品：

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

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

与

相同

$（'＃sample'）。dialog（{'title'：“我是样本}};

http://jsfiddle.net/wb5Ee/

Answer 3

liveQuery的替代品，因为它似乎已经过时了，因为我无法使其工作：

https://github.com/bapplistudio/jquery.build

您需要将所有jquery激活声明为* $（“body”）。build（function（）{}）; * 声明
你需要调用$（“newelement”）。build（）;回调所有初始化功能。

查看jquery.build站点上的文档以获取更多信息和示例以及与您的案例类似的实时演示。

http://saf.re/github/jquery.build/examples/simple.html

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

3 个答案: