0

我正在尝试启动一个 jquery ui 可调整大小的实例,但使用由 jquery 本身添加到 DOM 的选择器。这是我的脚本的一个基本示例:

HTML:

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

jQuery:

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

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

我考虑过使用类似于 live() 或 bind() 的东西,但我没有要绑定的事件。任何帮助表示赞赏。

4

2 回答 2

1

如果我做对了,您是否希望页面上具有“固定”类的任何内容都可以调整大小,即使该类是在页面加载后添加的?你说得对,live、bind 和 delegate 在这里无济于事。

我能想到两种可能,都不可爱。

首先,设置一个实时的“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');
于 2011-11-03T13:45:56.417 回答
1

我过去使用过 LiveQuery 插件 - http://brandonaaron.net/code/livequery/docs能够定位添加到 dom 的元素,就像你的情况一样。

于 2011-11-03T13:49:05.137 回答