Js判断表单提交

来源：互联网发布：数控加工及编程编辑：程序博客网时间：2024/05/29 15:03

本人第一次写博客，写的不好请见谅。吐舌头也不知道写的对不对，欢迎指正

第一种：表单提交，在form标签中增加onsubmit事件来判断表单提交是否成功，这种方法需要注意一下
     function validate(obj) {
        if (confirm("提交表单?")) {
           alert(obj.value);
           return true;
        } else {
           alert(obj.value);
           return false;
        }
     }
<body>
    <form onsubmit="return validate(document.getElementById('Text'));">
       <input type="text" id="Text"/>
       <input type="submit" value="submit"/>
    </form>
</body>

第二种方式：为submit按钮添加上onclick事件，为submit按钮添加上onclick事件,点击提交按钮表单直接提交
     function validate() {
        if (confirm("提交表单?")) {
           return true;
        } else {
           return false;
        }
     }
<body>
   <form>
       <input type="text"/>
       <input type="submit" value="submit" onsubmit="return validate()"/>
    </form>
</body>

第三种方式：通过button按钮来触发表单提交事件onclick="submitForm();"，会忽略掉其他标签中的属性，比如form标签中的onsubmit属性就失效了。这时为了进行表单验证，可以将验证代码放在submitForm();方法中进行验证。
     function validate() {
        if (confirm("提交表单?")) {
           return true;
        } else {
           return false;
        }
     }

     function submitForm() {
        if (validate()) {
           document.getElementById("myForm").submit();
        }
     }
<body>
    <form id="myForm">
       <input type="text"/>
       <input type="button" value="submitBtn" onclick="submitForm();"/>

    </form>
</body>

第四种方式：通过button按钮来触发表单提交事件submitForm

function validate() {

if (confirm("提交表单?")) {

return true;

} else {

return false;

}

function submitForm() {

if (validate()) {

document.getElementById("myForm").submit();

}

document.getElementById("myBtn").onclick = submitForm;

<body>

<formid="myForm">

</form>

</body>

阅读全文

0 1