Javascript 事件冒泡和onblur事件

Javascript 事件冒泡和onblur事件,javascript,event-bubbling,onblur,Javascript,Event Bubbling,Onblur,我正在编写一个表单验证脚本,并希望在触发onblur事件时验证给定字段。我还想使用事件冒泡,这样就不必将onblur事件附加到每个表单字段。不幸的是,onblur事件没有冒泡。只是想知道是否有人知道可以产生相同效果的优雅解决方案。aa,您只需在表单上添加onblur事件,并在每次更改表单中任何元素的焦点时调用验证,包括IE所需的解决方法:对于符合标准的浏览器,您需要使用事件捕获(而不是冒泡),对于IE: if (myForm.addEventListener) { // Standard

我正在编写一个表单验证脚本,并希望在触发onblur事件时验证给定字段。我还想使用事件冒泡,这样就不必将onblur事件附加到每个表单字段。不幸的是,onblur事件没有冒泡。只是想知道是否有人知道可以产生相同效果的优雅解决方案。

aa,您只需在表单上添加onblur事件,并在每次更改表单中任何元素的焦点时调用验证,包括IE所需的解决方法:

对于符合标准的浏览器,您需要使用事件捕获(而不是冒泡),对于IE:

if (myForm.addEventListener) {
    // Standards browsers can use event Capturing. NOTE: capturing 
    // is triggered by virtue of setting the last parameter to true
    myForm.addEventListener('blur', validationFunction, true);
}
else {
    // IE can use its proprietary focusout event, which 
    // bubbles in the way you wish blur to:
    myForm.onfocusout = validationFunction;
}

// And of course detect the element that blurred in your handler:
function validationFunction(e) {
    var target = e ? e.target : window.event.srcElement;

    // ...
}
有关详细信息,请参见

使用“Focusout”事件,因为它具有气泡效应。谢谢


要将冒泡与
onblur
事件一起使用,可以使用addEventListener()并将useCapture参数设置为false。像这样:

yourFormInput.addEventListener('blur', yourFunction, false);

Firefox 51及以下版本不支持
onfocusout
事件。因此,不要使用
onfocusout
而不是
onblur
事件。

每个表单字段都有不同的验证函数,或者对所有字段都是相同的?它们都使用相同的回调函数。回调函数在html元素上查找某些类,这些类告诉它如何进行验证(如“required”或“integer”),是否确定?我根本没想到这个形状会模糊,尤其是因为它一开始就没有焦点。