使用选择创建jQuery UI的可调整大小的实例添加到DOM的jQuery

Question

我试图启动一个jQuery用户界面可调整大小的实例，但使用选择的jQuery自身添加到DOM。这是我的脚本的一个基本的例子：

HTML：

<div class='lyr'></div> 

的jQuery：

// Add class 
$('lyr').addClass('fixed'); 

// Resizable 
$('.fixed').resizable({ 
    aspectRatio: true, 
    handles: 'all' 
}); 

我已经想过使用的东西沿着活线（）或bind（）但我没有绑定的事件。任何帮助赞赏。

Answer 1

我用的liveQuery插件 - 在过去http://brandonaaron.net/code/livequery/docs是能够针对添加到DOM元素，如在你的情况。

Answer 2

如果我有这个权利，你想什么在页面上有“固定”类可调整大小，即使该类是在页面加载后添加？你是对的，生活，绑定和委托在这里没有帮助。

我能想到的两种可能性，也不可爱。

首先，成立了现场“的mouseenter”事件，这将使该元素可以调整大小，如果它以前是不可能：

$(body).delegate(".fixed", "mouseenter", function(ev) { 
    var target = $(ev.target); 
    if (target.data("resizable")) return; 
    target.resizable({ 
     aspectRatio: true, 
     handles: 'all' 
    }); 
}) 

这让我们动轮没有事件绑定到的问题。

或者，你可以猴补丁jQuery.fn.addClass：

var classRe = new RegExp(c + className + \b); 
._addClass = jQuery.fn.addClass; 
jQuery.fn.addClass = function(className) { 
    if (classRe.test(classname)) { 
     if (this.data("resizable")) return; 
     this.resizable({ 
      aspectRatio: true, 
      handles: 'all' 
     }); 
    } 
    jQuery.fn._addClass.apply(this, arguments); 
} 

当然，如果类是通过addClass方法添加这只会工作。

在你的榜样

此外，

$('lyr').addClass('fixed'); 

也许应该是：

$('.lyr').addClass('fixed');