有没有办法将命令绑定到fadeIn事件而不必.trigger（’fadeIn’）？

我有一个具有不同模块的交互式表单系统，其中每个模块的表单包含在不同的div元素中。 当我从一个模块更改为另一个模块时，我经常这样做：

$('#module_1').hide(); $('#module_2').fadeIn(); 

我喜欢这个，但是现在，在开发这个系统一段时间之后，我有一些函数（比如重新初始化jqgrid），我想在每次fadeIn发生时发生。 我这样设置：

 $('#module_2').bind('fadeIn',function(){ initialize_jqgrid(); }); 

有没有办法让我能为$('#module_2').fadeIn();所有实例工作$('#module_2').fadeIn(); 无需去每个实例并用它替换它？

 $('#module_2').fadeIn().trigger('fadeIn'); 

这背后的动机就是拥有更清晰的代码， $('#module_2').fadeIn().trigger('fadeIn'); 有点多余。

非常感谢！

Answer 1

当然，

 var _old = $.fn.fadeIn; $.fn.fadeIn = function(){ var self = this; return _old.apply(this,arguments).promise().done(function(){ self.trigger("fadeIn"); }); }; // and your code: // replace .bind with .on if jQuery 1.7+ ​$("div").bind("fadeIn",function(){alert("worky");}); $("div").fadeIn(2000);​​​​​​​​​​​​​​​​​ 

演示
http://jsfiddle.net/gEVsX/2/

更新评论

 var _old = $.fn.fadeIn; $.fn.fadeIn = function(){ return _old.apply(this,arguments).trigger("fadeIn"); }; // and your code: // replace .bind with .on if jQuery 1.7+ ​$("div").bind("fadeIn",function(){alert("worky");}); $("div").fadeIn(2000);​​​​​​​​​​​​​​​​​ 

Answer 2

您可以定义回调函数并将其用作fadeIn（）的参数。

 function callback(){ initialize_jqgrid(); } $('div#module_2').fadeIn(duration,callback) 

Answer 3

简单function：

 switch_module('div#module_1','div#module_2'); function switch_module(old_selector, new_selector){ $(old_selector).hide(); initialize_jqgrid(); $(new_selector).fadeIn(); } 

Answer 4

你可以使用回调函数$('div#module_2').fadeIn(500, initialize_jqgrid);

并将所有内容放入具有generics选择器调用的函数中;

 function fadeModule(selector) { $(selector).fadeIn(500, initialize_jqgrid); } 

并将其称为fadeModule('div#module_2');

编辑：500是fadeIn的默认持续时间，放置任何你想要的。