form表单提交和阻止

2022-06-17 分类：网站建设

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
 <head> 
  <title> new document </title> 
  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> 
  <style type="text/css"></style> 
  <script type="text/javascript"> 
    //实例：submit按钮，结合onsubmit事件，验证和提交表单 
    function checkForm(){ 
        //判断用户名和密码是否为空 
        if(document.form1.username.value==""){ 
                window.alert("用户名不能为空"); 
                return false; 
        }else if(document.form1.username.value.length<5 || 
document.form1.username.value.length>20){ 
                window.alert("用户名在5-20位"); 
                return false; 
        }else if(document.form1.userpwd.value==""){ 
                window.alert("密码不能为空"); 
                return false; 
        }else if(document.form1.userpwd.value.length<5 || 
document.form1.userpwd.value.length>20){ 
                window.alert("密码必须在5-20位"); 
                return false; 
        } 
    } 
  </script> 
 </head> 
 <body> 

 <form name="form1" method="get" action="login.php"    onsubmit="return checkForm()"> 
     用户名：<input type="text" name="username" /> 
     密码：<input type="password" name="userpwd" /> 
     <input type="submit" value="提交表单" /> 
</form> 
 //单机以下的链接，不会跳转网址，因为默认动作被阻止了 
 <a href="http://www.itcast.cn" onclick="return false">北京交通网</a> 
 </body> 
</html>

名称栏目：form表单提交和阻止
网页链接：https://www.cdcxhl.com/news10/168510.html

成都网站建设公司_创新互联，为您提供自适应网站、App设计、动态网站、小程序开发、企业网站制作、定制网站

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：创新互联

猜你还喜欢下面的内容