Question

因此，在特定页面上，我有一些表单元素，在3到8之间，具体取决于用户及其在页面上的操作。

如何在页面上动态地向所有表单元素添加特定的onblur事件？

如果我有：

function doThisOnBlur() { stuff }

如果页面加载，如何将相同的功能添加到所有这些功能。页面加载后不会创建任何元素，但可能会为不同的用户显示不同的元素。

<input type="text" id="x">
<input type="text" id="y">
<select id="z">...</select>

这可能吗？

Answer 1

编辑：更新问题
使用.blur()和匿名函数（无论有多少元素）：

$(":input").blur(function() {
  //do stuff
});

如果你需要将某些函数绑定到某些字段，请在名称上使用类或attribute selector，以区分它们......如果选择器找不到元素，它就不会绑定事件处理任何东西。这样，相同的整体代码适用于所有用户，即使他们只看到某些可用的表单元素。

原始问题：如果在页面加载后动态添加元素我认为.live()捕获blur事件是您在此之后所使用的:input作为选择器：

$(":input").live('blur', function() {
  //do stuff
});

Answer 2

没有jQuery：

function doThisOnBlur(){
// your fancy code
}

var inputs = document.getElementsByTagName('input');
var selects = document.getElementsByTagName('select');

for (var i = 0; i < inputs.length; i++)
    inputs[i].onblur = doThisOnBlur;
for (var i = 0; i < selects.length; i++)
    selects[i].onblur = doThisOnBlur;

我尽可能地做到最简单。我会重构它并且不以这种方式分配事件处理程序，但我指出回答你的问题。

将onBlur添加到所有表单元素

2 个答案: