-1

我确定我错过了一些明显的东西，但知道为什么下面的 addEventListener 代码到处都在触发（不仅仅是在提交按钮上）？

HTML：

    <form action="#">
        <input type="text"><br>
        <input type="text"><br>
        <button id="submit">submit</button><br>
    </form>

JS：

    function validate () {
        var inputs = document.getElementsByTagName('input');
        var inputs_length = inputs.length-1;
        for (i=0; i<=inputs_length; i++) {
            var inputs_value = document.getElementsByTagName('input')[i].value;
            if (inputs_value == "") {
                alert('there is a text box empty');
            }
        }

    }   

    var el = document.getElementById('submit');

    if (el.addEventListener) {  
        el = addEventListener('click', validate, false);   
    } else if (el.attachEvent)  {  
      el.attachEvent('onclick', validate);  
    }

修复就是改变

el = addEventListener('click', validate, false);

到

el.addEventListener('click', validate, false);

我的错字:(

4

2 回答 2

1

改变这个：

if (el.addEventListener) {  
    el = addEventListener('click', validate, false);

对此：

if (el.addEventListener) {  
    el.addEventListener('click', validate, false);
于 2012-05-11T10:50:12.473 回答
0

很长的评论。

在您的代码中：

    // inputs is an HTMLCollection of all the inputs
    var inputs = document.getElementsByTagName('input');

    // No need for the -1
    var inputs_length = inputs.length;

    // Don't forget to declare counters too, very important
    // Just use < length
    for (var i=0; i<inputs_length; i++) {

        // Instead of this very inefficient method
        var inputs_value = document.getElementsByTagName('input')[i].value;

        // use the collection you already have
        var inputs_value = inputs[i].value;

        if (inputs_value == "") {
            alert('there is a text box empty');
        }
    }

最好inputs_value在开始时声明，这样所有声明都在一个地方，但正如你所拥有的那样，它是无害的。

哦，不要给表单元素命名或 id 为“提交”（或任何其他表单方法），因为它会隐藏同名的表单方法，因此无法调用它。

于 2012-05-11T11:13:19.590 回答