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

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

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

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

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

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

Answer 1

你有几个选择。 首先，有liveQuery插件 ，如下所示：

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

另一种方法是在加载时调用元素上的选择器，例如， 只在响应中查找所有.button ，因此在调用ajax之前不会.button现有元素：

 $.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（）; 回调所有初始化function。

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

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