2,JQuery学习-为页面的元素添加点击事件
<scripttype="text/javascript"src="jquery-1.8.2.js"></script><scripttype="text/javascript">//$(document).ready();这个是要在页面加载时执行的函数,document表示本页面 $(document).ready(function(){ //这个是给这个页面的所有a标签添加点击事件 $('a').click(function(){ //这个是点击处理函数的内部处理 alert("响应了a标签的点击"); }); //这个是给这个页面的所有input标签添加点击事件 /* $('input').click(function(){ alert("响应了input标签的点击"); }); */ //这个是给input标签下所有type为text的标签元素添加点击事件 /* $('input:text').click(function(){ alert("响应input标签下所有type为text的标签元素的点击事件"); }); */ //这个是给input标签下所有type为text的标签元素中的第一个也就是0号添加点击事件 /* $('input:text:first').click(function(){ alert("响应input标签下所有type为text的标签元素的第一个也就是0号的点击事件"); }); */ //这个是给input标签下所有type为text的标签元素中的第一个也就是4号添加点击事件 /* $('input:text:last').click(function(){ alert("响应input标签下所有type为text的标签元素的第一个也就是4号的点击事件"); }); */ //下面是一些常用的过滤属性 //even偶数 //odd基数 //eq等于 //lt小于 //gt大于 /////////////过滤属性的用法//////////////// /* $('input:text:even').click(function(){ alert("响应input下text下的第event号就是偶数号的点击"); }); */ $('input:text:gt(3)').click(function(){ alert("响应input下text下的大于3号元素的点击"); }); //这个是给class为readBox的标签元素添加点击事件 $('.redBox').click(function(){ alert("响应class为redBox的标签元素的点击事件"); }); }); //d </script><ahref="#">点击</a><br/>0号:<inputtype="text"name="t"/><br/>1号:<inputtype="text"/><br/>2号:<inputtype="text"/><br/>3号:<inputtype="text"/><br/>4号:<inputtype="text"/><br/><inputtype="checkbox"/><br/><divstyle="width:100px;height:100px;background-color:green;"></div><divstyle="width:100px;height:100px;background-color:red;"class="redBox"></div>
声明:本站所有文章资源内容,如无特殊说明或标注,均为采集网络资源。如若本站内容侵犯了原著者的合法权益,可联系本站删除。