from表单禁止提交

来源:互联网 发布:html5 canvas js框架 编辑:程序博客网 时间:2024/04/29 07:26
1、JavaScript验证阻止提交表单
  1. <html>  
  2. <head>  
  3. <meta http-equiv="Content-Type" content="text/html; charset=gbk">  
  4. <title>JavaScript禁止提交表单</title>  
  5. <script type="text/javascript">  
  6. function getObj(id){  
  7.     var Obj = document.getElementById(id).value;  
  8.     return Obj;  
  9. }  
  10.  
  11. function check(){  
  12.     if(getObj("test")==""){  
  13.         alert("文本框输入为空,不能提交表单!");  
  14.         document.getElementById("test").focus;  
  15.         return false;//false:阻止提交表单  
  16.     }  
  17. }  
  18. </script>  
  19. </head>  
  20. <body>  
  21. <form action="index.htm" method="post" onsubmit="return check()">  
  22.     <input type="text" name="test" id="test">  
  23.     <input type="submit" value="提交">  
  24. </form>  
  25. </body>  
  26. </html> 
2、jQuery验证阻止表单提交
  1. <html>  
  2. <head>  
  3. <meta http-equiv="Content-Type" content="text/html; charset=gbk">  
  4. <script type="text/javascript" src="/sunchis/script/jquery-1.3.2.js"></script>  
  5. <script type="text/javascript">  
  6. $(document).ready(function(){  
  7.     $(":submit[id=tijiao]").click(function(check){  
  8.         var val = $(":text[id=test]").val();  
  9.         if(val==""){  
  10.             alert("文本框输入为空,不能提交表单!");  
  11.             $(":text[id=test]").focus();  
  12.             check.preventDefault();//此处阻止提交表单  
  13.         }  
  14.     });  
  15. });  
  16. </script>  
  17. <title>jQuery禁止提交表单</title>  
  18. </head>  
  19. <body>  
  20. <form action="index.htm" method="post">  
  21.     <input type="text" name="test" id="test">  
  22.     <input type="submit" id="tijiao" value="提交">  
  23. </form>  
  24. </body>  
  25. </html> 
原创粉丝点击