发布于 2016-11-21 07:48:06 | 156 次阅读 | 评论: 0 | 来源: 网友投递

这里有新鲜出炉的jQuery示例,程序狗速度看过来!

jQuery javascript框架

jQuery是一个兼容多浏览器的javascript框架,核心理念是write less,do more(写得更少,做得更多)。jQuery在2006年1月由美国人John Resig在纽约的barcamp发布,吸引了来自世界各地的众多JavaScript高手加入,由Dave Methvin率领团队进行开发。


Jquery练习之表单验证实现代码,学习jquery的朋友可以参考下。
Jquery练习表单验证
 
<body> 
<form action="" method="post" id ="myform"> 
<table> 
<tr> 
<td>姓名:</td> 
<td><input type ="text" id = "name" name ="name"></td> 
</tr> 
<tr> 
<td>年龄:</td> 
<td><input type ="text" id="age" name ="age"></td> 
</tr> 
<tr> 
<td>性别:</td> 
<td><input type = "radio" id="sex_man" name="sex" value="男">男 <input type = "radio" id="sex_woman" name="sex" value = "女" checked ="checked">女</td> 
</tr> 
<tr> 
<td>地址:</td> 
<td> 
<select id = "add"> 
<option values="北京">北京</option> 
<option values="河南">河北</option> 
<option values="河南">河南</option> 
</select> 
</td> 
</tr> 
<tr> 
<td>爱好:</td> 
<td> 
<input type ="checkbox" id = "cbOnTheInternet" name="checkbox" value ="上网" checked="checked">上网 
<input type ="checkbox" id = "cbJuketing" name="checkbox" value="旅游">旅游 
<input type ="checkbox" id = "cbWatchingTv" name="checkbox" value="看电影">看电影 
</td> 
</tr> 
<tr> 
<td><input type ="submit" value="提交"></td> 
</tr> 
</table> 
</form> 
</body> 
</html> 

Jquery代码
 
$(document).ready( 
function() { 
$("#myform").submit(function(){ 
var username=$("#name").val(); 
var age=$("#age").val(); 
var sex=$("input[name ='sex'][checked]").val(); 
var address=$("#add option[selected]").val(); 
var size=$("input[name='checkbox'][checked]").size(); 

var favouriteArray=Array(size); 
$("input[name='checkbox'][checked]").each(function(index,docEl){ 
favouriteArray[index]=$(this).val();// or docEl.value 
}); 
if(username=="") 
{ 
alert("性名不能为空!"); 
$("#name").focus(); 
return false; 
} 
if(age=="") 
{ 
alert("年龄不能为空"); 
$("#age").focus(); 
return false; 
} 
if(size==0) 
{ 
alert("您还没有选择爱好哦!"); 
$("input[name='checkbox']").get(0).focus(); 
return false; 
} 
for(var i=0;i<favouriteArray.length;i++){ 
alert(favouriteArray[i]); 
} 
alert('提交成功!'); 
}); 

}); 


最新网友评论  共有(0)条评论 发布评论 返回顶部

Copyright © 2007-2017 PHPERZ.COM All Rights Reserved   冀ICP备14009818号  版权声明  广告服务