jQuery focusin 和 focusout 实时事件未触发

Question

jQuery 版本:1.4.1

我正在尝试编写一个简单的水印类型插件，并且我想利用实时事件，因为并非所有我需要使用它的元素都会在页面加载期间存在，或者它们可能会从页面中添加和删除DOM。然而，由于某种原因，这些事件从未触发。

这是不起作用的代码:

; (function($) {

    $.fn.watermark = function(text) {

        return $(this).each(function() {
            $(this).live('focusout', function() {
                if (this.value == "") {
                    this.value = text;
                }

                return false;
            });

            $(this).live('focusin', function() {
                if (this.value == text) {
                    this.value = "";
                }

                return false;
            });
        });
    }

})(jQuery);

我可以在不使用现场事件的情况下使其发挥作用。此代码确实有效:

; (function($) {

    $.fn.watermark = function(text) {

        return $(this).each(function() {
            $(this).focusout(function() {
                if (this.value == "") {
                    this.value = text;
                }

                return false;
            });

            $(this).focusin(function() {
                if (this.value == text) {
                    this.value = "";
                }

                return false;
            });
        });
    }

})(jQuery);

Answer 1

.live() 需要一个选择器而不是 DOM 元素，在您调用它的地方，它仅在 DOM 元素上，所以不要这样:

$(this).each(function() {
        $(this).live('focusout', function() {

试试这个(this 已经是一个 jQuery 对象):

this.live('focusout', function() {

它需要这个，因为 .live()有效，当事件冒泡到 document 时，它会检查该选择器......如果没有选择器，它就无法检查。另外，如果您有一个 DOM 元素并且事件处理程序仅用于它， .live()无论如何没有多大意义:)