JS校验实例

最新推荐文章于 2023-04-14 23:03:18 发布

wangfy_

最新推荐文章于 2023-04-14 23:03:18 发布

阅读量286

点赞数 1

分类专栏： front

本文链接：https://blog.csdn.net/chushoufengli/article/details/79946880

版权

front 专栏收录该内容

35 篇文章 0 订阅

订阅专栏

NO.1 —— return true 式

<script>
  	function check(){	
  		var a = document.thisFormFromWangfy.a.value;
  		var whiceCalculator = document.thisFormFromWangfy.whiceCalculator.value;
  		var b = document.thisFormFromWangfy.b.value;
  		if(a == "" || b == "") {
  			alert("不能为空");
  			return false;
  		} else if(whiceCalculator == "/" && b == 0){
   			alert("除数不能为零");
  			return false;
  		} else if(whiceCalculator != "+" && whiceCalculator != "-" && whiceCalculator != "*" && whiceCalculator != "/"){
  			alert("仅限四则运算");
  			return false;
  		} else {
  			return true;
  		}
  	}
</script>
  <body> 
  	<form action="calculatorAction.do" name="thisFormFromWangfy" onsubmit="return check()">
  		<% if(request.getAttribute("c") == null) {%>
 		<input name="a" type="text" value="4" size="6"/> 
 		<input name="whiceCalculator" type="text" value="+" size="1"/> 
 		<input name="b" type="text" value="3" size="6"/> 
 		<input type="submit" name="submit" value=" = "/> 
 		<% } else {%>		
 		<input name="a" type="text" value="<%=request.getAttribute("a")%>" size="6"/> 
 		<input name="whiceCalculator" type="text" value="<%=request.getAttribute("whiceCalculator")%>" size="1"/> 
 		<input name="b" type="text" value="<%=request.getAttribute("b")%>" size="6"/>
 		  =  
 		<input name="c" type="text" value="<%=request.getAttribute("c")%>" size="20"/>
 		<% } %>
 	</form>
  </body>

NO.2 —— 跳转式

<script>
  	function calculator(){	
  		var a = document.thisFormFromWangfy.a.value;
  		var whiceCalculator = document.thisFormFromWangfy.whiceCalculator.value;
  		var b = document.thisFormFromWangfy.b.value;
  		if(a == "" || b == "") {
  			alert("不能为空");
  			location.href="/Struts2DMIFromWangfy/task1Calculator.jsp";
  		} else if(whiceCalculator == "/" && b == 0){
   			alert("除数不能为零");
  			location.href="/Struts2DMIFromWangfy/task1Calculator.jsp";
  		} else if(whiceCalculator != "+" && whiceCalculator != "-" && whiceCalculator != "*" && whiceCalculator != "/"){
  			alert("仅限四则运算");
  			location.href="/Struts2DMIFromWangfy/task1Calculator.jsp";
  		} else if(whiceCalculator == "+") location.href="calculator_add_?a="+a+"&b="+b;
  			<!-- 【注意】【注意】calculator_add_ 是为了防止认错，认为包下的其他是*_*_*的形式！！ -->
  		else if(whiceCalculator == "-") location.href="calculator_subtract_?a="+a+"&b="+b;	
  		else if(whiceCalculator == "*") location.href="calculator_multiply_?a="+a+"&b="+b;
  		else if(whiceCalculator == "/") location.href="calculator_divide_?a="+a+"&b="+b;
  	}
</script>
  </head>
  
  <body> 
  	<form action="" name="thisFormFromWangfy">
  		<% if(request.getAttribute("c") == null) {%>
 		<input name="a" type="text" value="4" size="6"/> 
 		<input name="whiceCalculator" type="text" value="+" size="1"/> 
 		<input name="b" type="text" value="3" size="6"/> 
 		<input type="button" onclick="calculator()" value=" = "/> 
 		<% } else {%>		
 		<input name="a" type="text" value="<%=request.getAttribute("a")%>" size="6"/> 
 		<input name="whiceCalculator" type="text" value="<%=request.getAttribute("whiceCalculator")%>" size="1"/> 
 		<input name="b" type="text" value="<%=request.getAttribute("b")%>" size="6"/>
 		  =  
 		<input name="a" type="text" value="<%=request.getAttribute("c")%>" size="20"/>
 		<% } %>
 	</form>
  </body>

NO.3 return true 式 (跟NO.1一样？)

	<script type="text/javascript">
		function check(){
			if(document.getElementById("userName").value==""){
				alert('用户名不能为空');
                document.getElementById("userName").focus();
                return false;
			} else if(document.getElementById("password").value==""){
                alert('密码不能为空');
                document.getElementById("password").focus();
                return false;
			}          
		}
	</script>
	<body>
		<form action="LoginAction.do" method="post" onsubmit="return check()">
			<font color="red">${error}</font><br>
			用户名:<input type="text" id="userName" name="userName" value=""/> <br>
			 密码:<input type="password" id="password" name="password" value=""/><br>
			<input type="submit" name="submit" value="提交"/>
			<input type="reset" name="reset" value="重置"/><br>
   			<a href="register.jsp">没有账号？去注册</a>
		</form>
	</body>

NO.4

<script type="text/javascript">
    function check(){
        if(document.getElementById("password").value != document.getElementById("confirmPassword").value) {  //id id id id id id
              alert('两次密码不一致');
              return false;
        }
    }
</script>
<body>
    <!--<s:fielderror/><!--显示所有错误信息-->
    <form action="RegisterAction.do" method="post" ><!--onsubmit="return check()"-->
  		用户名:<input type="text" name="userName" value=""/><!--模型驱动--><s:fielderror fieldName="userName"/><br>
  		真实姓名:<input type="text" name="realName" value=""/><s:fielderror fieldName="realName"/><br>
  		邮箱:<input type="text" name="email" value=""/><s:fielderror fieldName="email"/><br>
  		密码:<input type="password" id="password" name="password" value=""/><s:fielderror fieldName="password"/><br>
  		确认密码：<input type="password" id="confirmPassword" name="confirmPassword" value=""/><s:fielderror fieldName="confirmPassword"/><br>
      	<input type="submit" name="submit" value="提交"/>
      	<input type="reset" name="reset" value="重置"/>
   </form>
</body>

wangfy_

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS校验实例

NO.1 —— return true 式&lt;script&gt; function check(){ var a = document.thisFormFromWangfy.a.value; var whiceCalculator = document.thisFormFromWangfy.whiceCalculator.value; var b = d...
复制链接

扫一扫