如何使用javascript/jquery写onshow事件？

Question

我的页面上有一个锚标记,我想要一个附加到它的事件,当这个元素的显示发生变化时会激活.

我怎么写这个活动？并且只要这个元素的显示发生变化就会捕获？

Answer 1

这是我在onShow上做的一种方式,作为一个jQuery插件.但是,它可能会或可能不会完全执行您正在执行的操作.

(function($){
  $.fn.extend({ 
    onShow: function(callback, unbind){
      return this.each(function(){
        var _this = this;
        var bindopt = (unbind==undefined)?true:unbind; 
        if($.isFunction(callback)){
          if($(_this).is(':hidden')){
            var checkVis = function(){
              if($(_this).is(':visible')){
                callback.call(_this);
                if(bindopt){
                  $('body').unbind('click keyup keydown', checkVis);
                }
              }                         
            }
            $('body').bind('click keyup keydown', checkVis);
          }
          else{
            callback.call(_this);
          }
        }
      });
    }
  });
})(jQuery);

您可以在$(document).ready()函数内调用它,并在显示元素时使用回调来触发,如此.

$(document).ready(function(){
  $('#myelement').onShow(function(){
    alert('this element is now shown');
  });
});

它的工作原理是将click,keyup和keydown事件绑定到body以检查是否显示了该元素,因为这些事件最有可能导致元素被显示并且非常频繁地由用户执行.这可能不是非常优雅,但可以完成工作.此外,一旦显示元素,这些事件将从身体解除绑定,以便不继续发射并降低性能.

Answer 2

您无法直接在 JavaScript 中获取 onshow 事件。请记住以下方法是非标准的。

在 IE 中你可以使用

onpropertychange 事件

元素属性更改后触发

对于 Mozilla

您可以使用

手表

监视要为属性分配值并在发生时运行函数。