将任何JavaScript函数转换为页面事件

时间:2010-05-07 19:09:18

标签: javascript events

我需要能够实现以下目标(以这种或那种方式):

function ShowContent() {}

document.onShowContent = function ()
{
     // anything I want to happen....
}

我要做的是向我添加一种监听器页面上的广告代码将在调用特定函数时自动刷新广告位。而不是让“ShowContent()”函数直接刷新广告代码,我希望广告代码在检测到“ShowContent()”被调用时刷新。

感谢。

2 个答案:

答案 0 :(得分:4)

现代的JavaScript库让这一切变得简单。当然,你可以“手动”完成它,但这里有一个jQuery的快速示例

首先,听众

$(document).bind( 'ShowContent', function()
{
  // anything you want
});

然后是触发器

$(document).trigger( 'ShowContent' );

如果你想要

,你甚至可以走这条路
function ShowContent()
{
  $(document).trigger( 'ShowContent' );
}

答案 1 :(得分:1)

这是一个快速的样本,我把它放在一起

 var ev = (function(){
     var events = {};
     return {
         on: function(name, handler){
             var listeners = (name in events) ? events[name] : (events[name] = []);
             listeners.push(handler);
         },
         raise: function(name){
             var listeners = events[name];
             if (listeners) {
                 var i = listeners.length;
                 while (i--) {
                     listeners[i]();
                 }
             }
         }
     };
 })();

 // add a listener
 ev.on("foo", function(){
     alert("bar");
 });

如果您无法手动更改相关方法以触发事件,则可以“包装”它。

 function methodIHaveNoControlOver(){
     ....
 }

 // intercept the call
 var originalFn = methodIHaveNoControlOver;
 // here we replace the FunctionDeclaration with a FunctionExpression containing a reference to the original FunctionDeclaration
 methodIHaveNoControlOver = function(){
     originalFn();
     ev.raise("foo");
 };

但请注意,如果methodIHaveNoControlOver使用this引用任何内容,则无效;这将需要更多的工作。