1

我实际上正在做一个关于 HTML5 表单和自定义 UI 界面验证更新的非常简单的示例。在行为方面我非常接近结果，但是我在我的 JS 代码中遇到了一些细节。

基本上我将输入事件附加到所有表单的输入元素。回调函数只是检查当前元素的有效性并应用自定义类以有点“实时”的方式设置元素的样式。

我面临的唯一问题是我需要将当前元素传递给事件处理程序中回调函数的参数。因为我需要将此事件附加到每个输入元素，所以我正在使用 for 循环。

我收到 jslint 警告：不要在循环中创建函数。

我不知道如何解决这个问题（我明白这意味着什么）。我不知道在不使用匿名函数的情况下将元素作为参数传递给回调函数。

所以问题是：如何将当前元素作为参数传递给外部函数来解决 jslint 警告。

如果有人有更好的方法来处理它，并且可以将其纠正为更有效的代码，那将不胜感激。这个例子可以在以后为一些学生服务。

这是一个代码笔： http ://codepen.io/anon/pen/bGDsB

4

2 回答 2

0

与其定义一个简单调用的新函数，不如直接check()传递check给addEventListener()：

  for (var i=0; i<inputs.length; i++) {
      inputs[i].addEventListener('input', check);
  }

然后，您可以check()稍作更改以解决此问题：

  function check(e) {
      var elm = e.srcElement;
      ...
  }

我没有针对 jsLint 对此进行测试，但它确实避免了在循环的每次迭代中创建一个新函数。

于 2013-09-12T10:45:22.887 回答
0

您的情况可以通过替换 for 循环并添加一个函数来解决：

for (var i=0; i<inputs.length; i++) {
    attachCheck(inputs[i]);
}
function attachCheck(inp) {
    inp.addEventListener('input', function() {
        check(this);
    });
}

check()修改为 use不是更好吗this，例如：

function check() {
    if(this.value.length) {
        // ... all elm replaced by this ...
}

和循环：

for (var i=0; i<inputs.length; i++) {
    inputs[i].addEventListener('input', check);
}
于 2013-09-12T10:58:20.250 回答