javascript重点

最新推荐文章于 2022-04-10 09:27:31 发布

搬运工9527

最新推荐文章于 2022-04-10 09:27:31 发布

阅读量301

点赞数

分类专栏：前端文章标签： javascript重点

本文链接：https://blog.csdn.net/qq_42260635/article/details/83657691

版权

前端专栏收录该内容

6 篇文章 0 订阅

订阅专栏

1.单选按钮，多选框，下拉框的校验问题

<body>
	<form action="demo2.html" method="post" onsubmit="return checkForm()">
		<p>姓名：<input type="text" id="name"></p>
		<p>性别：
			<input type="radio" name="gender">男 
			<input type="radio" name="gender">女
		</p>
		<p>爱好：
			<input type="checkbox" value="1" name="hobby">足球
			<input type="checkbox" value="2" name="hobby">篮球
			<input type="checkbox" value="3" name="hobby">排球
			<input type="checkbox" value="4" name="hobby">网球
		<p>
		<p>省份：
			<select id="province">
				<option value="0">请选择：</option>
				<option value="1">湖北省</option>
				<option value="2">湖南省</option>
				<option value="3">广西省</option>
			</select>
		</p>
		<p><input type="submit" value="提交"></p>
	</form>
</body>
</html>
<script type="text/javascript">	
	function checkForm(){
		//验证用户名
		var name = document.getElementById('name').value;
		if(name == ""){	
			alert("请输入姓名");
			return false;
		}
		//校验性别
		var gendercount=0;
		//通过getElementsByName获取得到一个数组
var array = document.getElementsByName("gender");
		for(var i=0;i<array.length;i++){
			if(array[i].checked == true){
				gendercount++;
			}
		}
		if(gendercount!=1){
			alert("请勾选性别")
			return false;
		}
		
		//校验爱好
		var hobbycoount=0;
var hobbys = document.getElementsByName("hobby");
		for(var i=0;i<hobbys.length;i++){
			if(hobbys[i].checked == true){
				hobbycoount++;
			}
		}
		if(hobbycoount==0){
			alert("请至少选择一项爱好");
			return false;
		}
		
		//校验省份
var pro = document.getElementById("province").value;
		if(pro == 0){
			alert("请选择省份");
			return false;
		}
		return true;
	}
</script>

校验

function checkForm(){
       var mailInfo = document.getElementById("mailInfo");
	var email = document.getElementById("email").value;
		  if(email==""){
			mailInfo.innerHTML ="邮箱不能为空";
			mailInfo.style.color ="red";
		    return false;  
		  }else{
			mailInfo.innerHTML =""; 
		  }
		  if(email.indexOf("@")!=-1||email.indexOf(".")!=-1){
		mailInfo.innerHTML ="填写邮箱不能带有.和@符号";
		mailInfo.style.color ="red";
		    return false;  
		  }else{
			mailInfo.innerHTML =""; 
		  }
	     
var passInfo = document.getElementById("passInfo");
var password = document.getElementById("password").value;
		  if(password==""){
		    passInfo.innerHTML ="密码不能为空";
			passInfo.style.color ="red";
		    return false;  
		  }else{
			passInfo.innerHTML =""; 
		  }
		  
		  var pass = document.getElementById("password");
		  if(pass.value.length<6||pass.value.length>12){
		    passInfo.innerHTML ="密码必须为6到12位";
		    return false;  
		  }else{
			passInfo.innerHTML =""; 
		  }
		
var passAgainInfo = document.getElementById("passAgainInfo");
var cpassword = document.getElementById("cpassword").value;
		  if(cpassword==""){
		 passAgainInfo.innerHTML ="再次输入密码不能为空";
		passAgainInfo.style.color ="red";
		    return false;  
		  }else{
			 passAgainInfo.innerHTML =""; 
		  }
		  if(cpassword != password){
		 passAgainInfo.innerHTML ="两次输入密码要一致";
		passAgainInfo.style.color ="red";
		    return false;  
		  }else{
			  passAgainInfo.innerHTML =""; 
		  }
		 
var nameInfo = document.getElementById("nameInfo");
var username = document.getElementById("username").value;
		  if(username==""){
		    nameInfo.innerHTML ="姓名不能为空";
			 nameInfo.style.color ="red";
		    return false;  
		  }else{
			  nameInfo.innerHTML =""; 
		  }
	
		  var first = username.charAt(0);
		  if(!(first>='a'&&first<='z')){
		    nameInfo.innerHTML ="姓名以小写字母开头";
			nameInfo.style.color ="red";
		    return false;  
		  }else{
			 nameInfo.innerHTML ="";   
		  }

		  var se=0;
var gender = document.getElementById("genderinfo");
 var sex=document.getElementsByName("sex")
		  for(var i=0;i<sex.length;i++){
			  if(sex[i].checked==true){
				  se++;
			  }
		  }
		  if(se==0){
			 gender.innerHTML ="请勾选性别";
			 gender.style.color ="red";
			 return false; 
		  }else{
			 gender.innerHTML ="";   
		  }

		  
var hobbyInfo= document.getElementById("hobbyInfo");
		  var hob=0;
		  var hobby=document.getElementsByName("hobby")
		  for(var i=0;i<sex.length;i++){
			  if(hobby[i].checked==true){
				  hob++;
			  }
		  }
		  if(hob==0){
			 hobbyInfo.innerHTML ="请至少选择一项爱好";
			 hobbyInfo.style.color ="red";
			 return false; 
		  }else{
			 hobbyInfo.innerHTML ="";   
		  }
	  
		  return true;
	  }

3.JSP中include指令和include动作区别详解

JSP中include指令和include动作区别详解
我们都知道在JSP中include有两种形式,分别是
＜%@ include file=” ”%＞
＜jsp:include page=” ” flush=”true”/＞
前者是指令元素，后者是动作元素。具体它们将在何处用？如何用及它们有什么区别？这应该是很多人看到它都会想到的问题。下面一起来看看吧。
通常当应用程序中所有的页面的某些部分（例如标题、页脚和导航栏）都相同的时候，我们就可以考虑用include。具体在哪些时候用＜%@ include file=” ”%＞，哪些时候用＜ jsp:include page=” ” flush=”true”/＞.这种形式。首先要明白的是它们之间的区别。只有了解了它们用法的不同才理解该在何时去用以及如何选择。
＜%@ include file=” ”%＞,jsp的include指令元素读入指定页面的内容。并把这些内容和原来的页面融合到一起。（这个过程是在翻译阶段:也就是jsp被转化成servlet的阶段进行的。
这里对翻译阶段进行一下说明:我们知道，jsp页面不能原封不动地被传送给浏览器，所有的jsp元素都必须首先由服务器进行处理。这是通过将jsp页面转达化成servlet，然后执行这个servlet来完成的。服务器需要一个jsp容器来处理jsp页面。jsp容器通常以servlet的形式来实现，这个servlet经过配置，可以处理对jsp页面的所有请求。
Jsp容器负责将jsp页面转化成servlet（称为jsp页面实现类?JSP Page implementation class）,并编译这个servlet。这两步就构成了翻译阶段.
由此我们就会知道：jsp页面是把include指令元素所指定的页面的实际内容（也就是代码段）加入到引入它的jsp页面中,合成一个文件后被jsp容器将它转化成servlet。可以看到这时会产生一个临时class文件和一个java文件。