Question

是否可以将观察者添加到由可见性更改触发的DOM元素（即调用show()和hide()）？谢谢！

Answer 1

如果您想观察对.show()或.hide()的任何调用并且可以访问jQuery 1.5+，您可以使用jQuery.sub()创建一个jQuery对象用于覆盖默认的.show()或.hide()操作。

var myjQuery = jQuery.sub();
myjQuery.fn.hide = function() {
    alert('hide');

    return jQuery.fn.hide.apply(this, arguments);
};
myjQuery.fn.show = function() {
    alert('show');
    return jQuery.fn.show.apply(this, arguments);
};

然后使用.sub()副本

(function($) {
    $(document).ready(function() {
        $(".click").click(function() {
            if ($("#hide").is(":visible")) {
                $("#hide").hide();
            }
            else {
                $("#hide").show();
            }
        });
    });
})(myjQuery);

<强> Example on jsfiddle

Answer 2

我不知道开箱即用，但如果通过jquery进行更改，您可以使用这样的自定义事件轻松自行添加跟踪：

// save the jquery.show() method
$.prototype.base_show = $.prototype.show;
// provide your own that trigger the event then call the original one
$.prototype.show = function(speed, easing, callback) {
    // call your custom event, add any parameters you need there
    $(window).trigger('on_jquery_show'/*, params you need*/);
    // now call the "real" show method
    $.prototype.base_show(speed, easing, callback);
    // return this so you can chain it
    return this;
};
// add some callback to that custom event
$(window).bind('on_jquery_show', function() { console.log('show !'); });
// it works !
$('#some_div').show().show();

hide（）也是一样。

Answer 3

是的，你可以：

例如：

 $('#divID').show('slow', function() {
    // Animation complete.
 });

请参阅docs

Answer 4

假设您使用jQuery机制显示和隐藏，您可以尝试使用Live Query插件。

Live Query也有能力当它发出一个函数（回调）匹配一个新元素和另一个元素函数（回调）的时候元素不再匹配。

观察jQuery中的显示更改

4 个答案: