-
//给body绑定一个click事件 //没有直接a元素绑定点击事件 //通过委托机制，点击a元素的时候，事件触发 $('body').on('click', 'a', function(e) { alert(e.target.textContent) })查看全部
-
select事件只能用于<input>元素与<textarea>元素查看全部
-
mouseenter与mouseleave，这样可以避免冒泡问题查看全部
-
mouseover有事件冒泡的问题，mouseenter可以避免事件冒泡。查看全部
-
<h4>测试二</h4> <div class="left"> <div class="aaron1"> <p>鼠标移进此区域触发mouseover事件</p> <a>进入元素内部,mouseover事件触发次数：</a> </div> </div> <script type="text/javascript"> var n = 0; //绑定一个mouseover事件 $(".aaron1 p:first").mouseover(function(e) { $(".aaron1 a").html('进入元素内部,mouseover事件触发次数：' + (++n)) }) </script> <h4>测试三</h4> <div class="right"> <div class="aaron2"> <p>鼠标移动：不同函数传递数据</p> <a>进入元素内部,mouseover事件触发次数：</a> </div> </div> <br/> <script type="text/javascript"> var n = 0; //不同函数传递数据 function data(e) { $(".right a").html('mouseover事件触发次数：' + (++n) + '<br/> 传入数据为 ：'+ e.data) } function a() { $(".right p:first").mouseover('data = 慕课网', data) } a(); </script>查看全部
-
<h4>测试二</h4> <div class="left"> <div class="aaron1"> <p>鼠标在绿色区域移动触发mousemove</p> <p>移动的X位置：</p> </div> </div> <script type="text/javascript"> //绑定一个mousemove事件 //触发后修改内容 $(".aaron1").mousemove(function(e) { $(this).find('p:last').html('移动的X位置：' + e.pageX) }) </script>查看全部
-
<h4>测试一</h4> <button>弹出回调中的鼠标键</button> <script type="text/javascript"> //this指向button元素 $("button:eq(0)").mousedown(function(e) { alert('e.which: ' + e.which) }) </script>查看全部
-
<h4>测试三</h4> <div class="test3"> <p>$('.right').click(1111, set)</p> </div> <button>不同函数传递数据</button> <script type="text/javascript"> //不同函数传递数据 function data(e) { alert(e.data) //1111 } function a() { $("button:eq(2)").dblclick(1111, data) } a(); </script>查看全部
-
1、当textarea或文本类型的input元素中的文本被选择时，会发生select事件。 这个函数会调用执行绑定到select事件的所有函数，包括浏览器的默认行为。可以通过在某个绑定的函数中返回false来防止触发浏览器的默认行为。 注意：select事件只能用于<input>元素与<textarea>元素 2、select事件 （1）方法一：.select() 触发元素的select事件: $("input").select(); （2）方法二：$ele.select( handler(eventObject) ) 绑定$ele元素，每次$ele元素触发点击操作会执行回调handler函数，这样可以针对事件的反馈做很多操作了 <input id="test" value="文字选中"></input> $("#text").select(function() { //响应文字选中回调 //this指向 input元素 }); （3）方法三：$ele.select( [eventData ], handler(eventObject) ) 使用与方法二一致，不过可以接受一个数据参数，这样的处理是为了解决不同作用域下数据传递的问题 <input id="test" value="文字选中"></input> $("#text").select(11111,function(e) {//响应文字选中回调 //this指向 div元素 //e.date => 11111 传递数据 });查看全部
-
1、对于表单焦点处理事件focusin获焦事件与focusout失焦事件，同样用于处理表单焦点的事件还有blur失焦事件与focus获焦事件 2、blur与focus事件之间的本质区别：是否支持冒泡处理 （1）例子 <div> <input type="text" /> </div> 其中input元素可以触发focus()事件 div是input的父元素，当它包含的元素input触发了focus事件时，它就产生了focusin()事件。 （2）focus()在元素本身产生，focusin()在元素包含的元素中产生 blur与focusout也亦是如此 （3） ①focus()是元素本身失去焦点时触发， ②focusin()是元素的子元素失去焦点时触发，本身失去焦点时是不会触发该事件的.如果是多级子元素，任何一级的子元素失去焦点都会触发最高一级元素的focusin()事件 3、blur失焦与focus获焦、focusin获焦与focusout失焦的区别 ①blur失焦：不支持冒泡 ②focus获焦：不支持冒泡 ③focusin获焦：支持冒泡 ④focusout失焦：支持冒泡查看全部
-
1、<input>元素，<textarea>和<select>元素都是可以选择值一些改变，可以通过change事件去监听这些改变的动作 （1）input元素 监听value值的变化，当有改变时，失去焦点后触发change事件 （2）select元素 对于下拉选择框，复选框和单选按钮，当用户用鼠标作出选择，该事件立即触发 （3）textarea元素 多行文本输入框，当用户用鼠标点击时，该事件立即触发 2、change事件很简单，无非就是注意下触发的先后行为查看全部
-
1、当一个元素，或者其内部任何一个元素失去焦点的时候，比如input元素，用户在点击失去焦的时候，如果开发者需要捕获这个动作，jQuery提供了一个focusout事件 2、focusout事件（失焦） （1）方法一：$ele.focusout() 绑定$ele元素，不带任何参数一般是用来指定触发一个事件，一般用比较少 <div id="test">点击触发<div> $("ele").focusout(function(){ alert('触发指定事件') }) $("#text").mouseup(function(){ $("ele").focusout() //指定触发事件 }); （2）方法二：$ele.focusout( handler ) 绑定$ele元素，每次$ele元素触发点击操作会执行回调handler函数，这样可以针对事件的反馈做很多操作了 <div id="test">点击触发<div> $("#text").focusout(function() { //this指向 div元素 }); （3）方法三：$ele.focusout( [eventData ], handler ) 使用与方法二一致，不过可以接受一个数据参数，这样的处理是为了解决不同作用域下数据传递的问题 <div id="test">点击触发<div> $("#text").focusout(11111,function(e) { //this指向 div元素 //e.date => 11111 传递数据 });查看全部
-
1、当一个元素，或者其内部任何一个元素获得焦点的时候，例如：input元素，用户在点击聚焦的时候，如果开发者需要捕获这个动作的时候，jQuery提供了一个focusin事件 2、focusin()事件（获焦） （1）方法一：$ele.focusin() 绑定$ele元素，不带任何参数一般是用来指定触发一个事件，一般用比较少 <div id="test">点击触发<div> $("ele").focusin(function(){ alert('触发指定事件') }) $("#text").mouseup(function(){ $("ele").focusin() //指定触发事件 }); （2）方法二：$ele.focusin( handler ) 绑定$ele元素，每次$ele元素触发点击操作会执行回调handler函数，这样可以针对事件的反馈做很多操作了 <div id="test">点击触发<div> $("#text").focusin(function() { //this指向 div元素 }); （3）方法三：$ele.focusin( [eventData ], handler ) 使用与方法二一致，不过可以接受一个数据参数，这样的处理是为了解决不同作用域下数据传递的问题 <div id="test">点击触发<div> $("#text").focusin(11111,function(e) { //this指向 div元素 //e.date => 11111 传递数据 });查看全部
-
1、学了mouseover、mouseout、mouseenter、mouseleave事件，也理解了四个事件的相同点与不同点，现在可以用来给元素做一个简单的切换效果 在元素上移进移出切换其换色，一般通过2个事件配合就可以达到，这里用mouseenter与mouseleave，这样可以避免冒泡问题 $(ele).mouseenter(function(){ $(this).css("background", '#bbffaa'); }) $(ele).mouseleave(function(){ $(this).css("background", 'red'); }) 2、这样目的是达到了，稍微有点多，对于这样的简单逻辑jQuery直接提供了一个hover方法（切换效果），可以便捷处理 只需要在hover方法中传递2个回调函数就可以了，不需要显示的绑定2个事件 $(selector).hover(handlerIn, handlerOut) ①handlerIn(eventObject)：当鼠标指针进入元素时触发执行的事件函数 ②handlerOut(eventObject)：当鼠标指针离开元素时触发执行的事件函数查看全部
-
1、用交互操作中，经常需要知道用户操作鼠标是否有移到元素内部或是元素外部，因此jQuery提供了 ①mouseenter的快捷方法：可以监听用户移动到内部的操作（进入） ②mouseleave的快捷方法：可以监听用户移动到外部的操作（离开） 2、三种参数传递方式与mouseover和mouseout是一模一样的 3、mouseenter JavaScript事件是Internet Explorer专有的。由于该事件在平时很有用，jQuery的模拟这一事件，以便它可用于所有浏览器。该事件在鼠标移入到元素上时被触发。任何HTML元素都可以接受此事件。 4、mouseenter事件（与mouseleave事件）和mouseover的区别 关键点就是：冒泡的方式处理问题 （1）mouseover为例： <div class="aaron2"> <p>鼠标离开此区域触发mouseleave事件</p> </div> 如果在p元素与div元素都绑定mouseover事件，鼠标在离开p元素，但是没有离开div元素的时候，触发的结果： p元素响应事件 div元素响应事件 这里的问题是div为什么会被触发？ 原因就是事件冒泡的问题，p元素触发了mouseover，他会一直往上找父元素上的mouseover事件，如果有全触发了 所以在这种情况下面，jQuery推荐我们使用 mouseenter事件 mouseenter事件只会在绑定它的元素上被调用，而不会在后代节点上被触发查看全部
举报
0/150
提交
取消