13

我正在尝试设置一个侦听器来侦听所有焦点事件。特别是我试图在任何时候输入或文本框获得焦点。根据一些研究，实现这一目标的广泛接受的方法是这样的：

document.body.onfocus = function(event) {
   //Check the event.target for input/textbox
   //Do something
};

但是 document.body.onfocus 似乎永远不会触发。我认为这可能是因为该文档实际上并没有获得焦点所以我尝试了：

document.body.focus();

最初“设置”焦点，但这也不起作用。

关于如何在所有输入/文本框上收听焦点事件而不直接在元素本身上实际设置事件的任何想法？请只使用香草 javascript，我没有使用框架。

根据接受的答案，这里有一些工作代码：

var focusHandler = function(event) {
    var type = event.target.nodeName.toLowerCase();
    if(type == 'input' || type == 'textarea') {
        //Do something
    }
};
document.body.addEventListener('focus', focusHandler, true); //Non-IE   
document.body.onfocusin = focusHandler; //IE
4

2 回答 2

9

由于某些事件（焦点、模糊、变化）不会冒泡，我建议您尝试一下Event Capturing。首先onfocus不适用于此，因此您必须使用addEventListener可以在第三个参数中指定使用的委托模式的位置。查看MDN以了解addEventListener.

并查看本文以获取有关委派焦点事件的更多信息。

于 2013-04-08T14:51:04.057 回答
6

该focus事件不会从元素冒泡到它们的祖先元素，因此您不能使用事件委托（挂钩它body并为 的所有后代看到它body）来检测它。

有一个较新的事件focusin（微软的一项创新，现在也可以在其他浏览器中使用），它确实会冒泡，因此这可能对您有用，具体取决于您想要支持的浏览器。

于 2013-04-08T14:44:02.907 回答