javascript - 点击提交按钮后submit事件没有被触发-PHP中文网问答

var forms = document.querySelectorAll("form")
for (var i = 0; i < forms.length; i++) {
    forms[i].addEventListener("submit", function (e) {
        console.log(this);
        if (!this.checkValidity()) {
            e.preventDefault();
        }
    }, true);
}

    
        
        
            Contact Info
            name
            
            email

控制台中观察不到this的输出

更新结果：
submit事件在填写的表单内容符合要求时才会被触发。所以我后面的 if (!this.checkValidity()
如果我将表单全部填对的话是能看到this的输出的。
@yunkehe 绑定在submit上的确能阻止跳转,我这里没有成功阻止跳转是因为我的if语句没有意义造成的

在submit事件触发时验证表单内容来阻止表单提交是为了验证在js中自定义的检测
比如


    
        Change Your Password
        
            
                Password 1:
                
            
            
                Password 2:

通过 setCustomValidity('Passwords must match.'); 如果两个密码不匹配的话，this.checkValidity() 将会返回false。此时表单提交将会被阻止。
每次通过checkValidity方法验证表单元素正确性的时候且验证失败，出错节点的invalid事件会被触发，我们可以在这里添加一些对用户有用的信息。
例子来自 http://www.html5rocks.com/en/tutorials/forms/constraintvalidation/

var forms = document.querySelectorAll("form") for (var i = 0; i < forms.length; i++) { forms[i].addEventListener("submit", function (e) { console.log(this, this.checkValidity()); e.preventDefault(); }, true); }