通过标记调用全局函数可能吗?

问题描述:

我有类似我的源代码下面的许多实例:通过标记调用全局函数可能吗?

  <input id="a" type="text" name="a" maxlength="40" 
      onfocus="ThisOnFocus(this)" onkeydown="ThisOnKeyDown(this)" onkeyup="ThisOnKeyUp(this)" onblur="ThisOnBlur(this)"/> 

每个输入标签与聚焦状态结束的onkeydown,的onkeyup,和的onblur函数调用。

我想要做的是全局性地指定所有输入标签在这些事件上调用这些函数。这是可以在JavaScript中做的事吗?谢谢!

编辑:我曾尝试在脚本部分放置这一点,并没有在我的职务被称为:

document.onload = function() { var inputs = document.getElementsByTagName('input'); 
    for (i = 0; i < inputs.length; i++) { 
    inputs[i].onfocus = ThisOnFocus; 
    inputs[i].onblur = ThisOnBlur; 
    inputs[i].onkeyup = ThisOnKeyUp; 
    inputs[i].onkeydown = ThisOnKeyDown; 
    } 
    } 

编辑:另外,也可以不输入复选框和文本框来区分是很重要的,但这些函数都属于文本域。

你有几个问题:

  1. onload是一个事件处理程序,它适用于window对象。
  2. 您的事件处理函数正在等待您未传递的参数。例如,在你的标记中,你有ThisOnBlur(this),但是在代码中你只是使用ThisOnBlur而不传递参数。

下面我将如何改变你的代码:

function createEventHandler(fn, input) { 
    return function() { 
     fn(input); 
    }; 
} 

window.onload = function() { 
    var inputs = document.getElementsByTagName('input'); 
    for (i = 0; i < inputs.length; i++) { 
     inputs[i].onfocus = createEventHandler(
      ThisOnFocus, inputs[i]); 

     inputs[i].onblur = createEventHandler(
      ThisOnBlur, inputs[i]); 

     inputs[i].onkeydown = createEventHandler(
      ThisOnKeyDown, inputs[i]); 

     inputs[i].onkeyup = createEventHandler(
      ThisOnKeyUp, inputs[i]); 
    } 
}; 

createEventHandler功能可以让你去,利用正确的参数来调用现有的事件处理函数的引用。

下面是一个例子:http://jsfiddle.net/YPNmd/

+0

只是为了警告其他人,点击这些文本框的一个导致无限循环。 – Mike

+0

我最终得到这个使用body onload的工作。否则它不会起作用。但这个答案让我在那里。谢谢! – Mike

+0

@Mike:很高兴帮助,虽然它应该在''你的HTML文档的标签太... –

看一看这里:http://triaslama.wordpress.com/2008/07/22/four-ways-javascript-binding-event-listeners/

如果我是你,我会选择jQuery的。但它在纯Javascript中是可行的。 :)

这确实是一个字global scope的问题。如果你的JS分散在多个文件中,你必须将上述答案的代码写入一个文件中,该文件在调用每个其他JS函数的主文件之前调用。

如果您有一个文件,请将这些行放在每个函数外部的顶部。这使得它在JS中是全球性的。但在这种情况下使用jQuery方法是可以建议的,因为全局变量是崩溃的基本点。尽量避免使用它们

您可以使用捕获和冒泡。请注意,对于焦点和模糊事件,需要捕获。或者,您可以使用focusin和focusout事件。

现场演示:http://jsfiddle.net/t2KdS/