Question

我正在创建一个网络表单，并且为了使用 onblur事件验证文本字段。但是，如果我将文本字段留空并转到其他消息框，则会发生这种情况，并且当我尝试返回到前一个onblur事件时，第二个事件将被触发，并且它会像无限循环一样。我不能使用 document.form.write 。有没有其他方法，使用JavaScript，来打印错误信息？

Answer 1

如果你使用jQuery就很容易了。

$('input[type="text"]').blur(function() 
     ...
});

纯粹的javascript方式就像

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

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

// Common function
function functionHandler() {
    if(this.value == "") { //get the value of tb triggering the event
        alert('empty'); //show the message
    }        
}

Demo

Answer 2

快速（但不优雅）修复：您可以修改现有代码以使用onchange而不是onblur - 然后只有在内容实际发生更改时才会触发事件（和消息）焦点，所以如果你在字段之间来回点击而不改变任何东西，你的验证将不会被触发。

更好的解决方案是执行不弹出消息但将其显示为页面一部分的内容。一种方法是使用JS简单地更改字段的背景颜色（如果它是无效的），然后在提交弹出窗口时单个消息列出所有未完成的错误。

多个文本字段上的onBlur事件

2 个答案:

Demo