javascript - 表单 onsubmit 动态附加以进行验证

Question

我正在尝试使用动态添加 onsubmit 事件

if (window.addEventListener){   
    window.addEventListener('load', attachFormSubmit, false); 
} else if (window.attachEvent){ 
    window.attachEvent('onload', attachFormSubmit );
}

但是如果您在此 URL http://www.w3schools.com/js/js_form_validation.asp上看到示例

它说。

<form onsubmit="return validateForm()" />

return 语句，这如何与动态分配一起工作。

编辑..

我的问题是关于 onsubmit 内部带有 return 语句的内联调用，我们可以在 onsubmit 处理程序内部的硬编码“return validateForm()”中动态地执行此操作吗？

Answer 1

为您的表单提供一个 ID，然后执行以下操作：

document.getElementById("formId").onsubmit = validateForm;

Answer 2

HTML

<form action="processor.php" method="post" id="myform">
    <input type="checkbox" id="agree" name="agree"/>
    <label for="agree">I agree to the TOS.</label>
    <input type="submit" value="Submit">
</form>

Javascript

如果您已经找到了一个好的跨浏览器 DOMContentLoaded/onload 实现，假设init()在开始时运行。

function validateForm(evt) {
    if(!document.getElementById('agree').checked) {
    //  W3C spec
        if(evt.preventDefault)
            { evt.preventDefault(); }
    //  IE < 9
        else if(evt.returnValue)
            { evt.returnValue = false; }
    //  catch-all
        return false;
    }
}
function init() {
    var myForm = document.getElementById('myform');

//  W3C spec
    if(myForm.addEventListener)
        { myForm.addEventListener('submit',validateForm,false); }
//  IE < 9
    else if(myForm.attachEvent)
        { myForm.attachEvent('onsubmit',validateForm); }
//  catch-all
    else
        { myForm.onsubmit = validateForm; }
}