jQuery 元素存在事件

Question

一旦页面上存在特定元素，是否有一个事件或简单函数用于调用回调。 我不是问如何检查元素是否存在。

作为一个例子，

$("#item").exists(function(){ });

我最终使用了就绪事件

 $("#item").ready(function(){ });

Answer 1

LiveQuery jQuery 插件似乎是大多数人用来解决这个问题的。

Live Query 通过绑定事件或
即使在之后，也会自动触发匹配元素的回调
页面已加载并且 DOM 已更新。

这是我整理的一个快速 jsfiddle 来演示这一点： http://jsfiddle.net/87WZ3/1/

这是每次创建 div 时触发事件并写出刚刚创建的 div 的唯一 id 的演示： http://jsfiddle.net/87WZ3/2/

Answer 2

我遇到了同样的问题，所以我继续为其编写了一个插件： https://gist.github.com /4200601

$(selector).waitUntilExists(function);

代码：

(function ($) {

/**
* @function
* @property {object} jQuery plugin which runs handler function once specified element is inserted into the DOM
* @param {function} handler A function to execute at the time when the element is inserted
* @param {bool} shouldRunHandlerOnce Optional: if true, handler is unbound after its first invocation
* @example $(selector).waitUntilExists(function);
*/

$.fn.waitUntilExists    = function (handler, shouldRunHandlerOnce, isChild) {
    var found       = 'found';
    var $this       = $(this.selector);
    var $elements   = $this.not(function () { return $(this).data(found); }).each(handler).data(found, true);

    if (!isChild)
    {
        (window.waitUntilExists_Intervals = window.waitUntilExists_Intervals || {})[this.selector] =
            window.setInterval(function () { $this.waitUntilExists(handler, shouldRunHandlerOnce, true); }, 500)
        ;
    }
    else if (shouldRunHandlerOnce && $elements.length)
    {
        window.clearInterval(window.waitUntilExists_Intervals[this.selector]);
    }

    return $this;
}

}(jQuery));

Answer 3

看一下 .live 函数。它对选择器中所有当前和未来的元素执行。

$('div').live( function() {});