js表单提交的三种方式

xiaoxiao2021-02-28  133

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>表单提交的三种方式</title> <script type="text/javascript"> //button按钮结合submit()提交表单 function checkForm(){ if(document.form1.in1.value==""){ alert("用户名不能为空。。。"); }else if(document.form1.in2.value.length == 0){ alert("密码不能为空。。。"); }else{ alert("提交成功!"); form1.submit();//提交表单 } } //submit按钮结合onclick方法 function checkForm2(){ if(document.form1.in1.value==""){ alert("用户名不能为空。。。"); return false; }else if(document.form1.in2.value.length == 0){ alert("密码不能为空。。。"); return false; }else{ alert("提交成功!"); return true; } } //区别:调用方式以及具有返回值 //submit按钮结合onsubmit()方法 function checkForm3(){ if(document.form1.in1.value==""){ alert("用户名不能为空。。。"); return false; }else if(document.form1.in2.value.length == 0){ alert("密码不能为空。。。"); return false; }else{ alert("提交成功!"); return true; } } //区别:调用的方式 </script> </head> <body> <form action="#" name="form1" method="post" onsubmit="return checkForm3()"> 用户名:<input type="text" name="in1"/><br> 密 码:<input type="password" name="in2"/><br> <!-- <input type="button" value="提交" onclick="checkForm()"/> --> <!-- <input type="submit" value="提交" onclick="return checkForm2()"/> --> <input type="submit" value="提交"/> </form> </body> </html>
转载请注明原文地址: https://www.6miu.com/read-21938.html

最新回复(0)