-
click方法用于监听用户单击操作,dblclick方法用于监听用户双击操作。下面以click()事件为例,使用上非常简单: 方法一:$ele.click() 绑定$ele元素,不带任何参数一般是用来指定触发一个事件,用的比较少 <div id="test">点击触发<div> $("#text").click(function(){ $("ele").click() //手动指定触发事件 }); 方法二:$ele.click( handler(eventObject) ) 绑定$ele元素,每次$ele元素触发点击操作会执行回调 handler函数,这样可以针对事件的反馈做很多操作了,方法中的this是指向了绑定事件的元素 <div id="test">点击触发<div> $("#text").click(function() { //this指向 div元素 }); 方法三:$ele.click( [eventData ], handler(eventObject) ) 使用与方法二一致,不过可以接受一个数据参数,这样的处理是为了解决不同作用域下数据传递的问题 <div id="test">点击触发<div> $("#text").click(11111,function(e) { //this指向 div元素 //e.date => 11111 传递数据 }); dbclick()的用法和click()的用法是类似的,可以参考以上click()的用法。 dbclick与click事件不同的是: click事件触发需要以下几点: click事件其实是由mousedown与mouseup 2个动作构成,所以点击的动作只有在松手后才触发 dblclick事件触发需要以下几点: dblclick又是由2个click叠加而来的,所以dblclick事件只有在满足以下条件的情况下才能被触发 鼠标指针在元素里面时点击。 鼠标指针在元素里面时释放。 鼠标指针在元素里面时再次点击,点击间隔时间,是系统而定。 鼠标指针在元素里面时再次释放。 注意:在同一元素上同时绑定 click 和 dblclick 事件是不可取的。查看全部
-
jQuery事件对象的属性和方法查看全部
-
$('body').on('click','a',function(e){ alert(e.target.value); }) 委托机制查看全部
-
keydown 和 keyup查看全部
-
focusin()聚焦 <script type="text/javascript"> //input聚焦 //给input元素增加一个边框 $("input:first").focusin(function() { $(this).css('border','2px solid red') }) </script> <script type="text/javascript"> //不同函数传递数据 function fn(e) { $(this).val(e.data) } function a() { $("input:last").focusin('慕课网', fn) } a(); </script>查看全部
-
jQuery事件对象的作用 事件中的Event对象容易被初学者忽略掉,可能大多时候初学者不知道怎么去用它,但有些时候它还是非常有用的 一个标准的"click"点击事件 $(elem).on("click",function(event){ event //事件对象 }) 在不同浏览器之间事件对象的获取, 以及事件对象的属性都有差异。jQuery根据 W3C 标准规范了事件对象,所以在jQuery事件回调方法中获取到的事件对象是经过兼容后处理过的一个标准的跨浏览器对象 这里不在千篇一律的说方法的使用,通过实际的一个小案例,从而来了解事件对象的作用 <ul> <li class="even1"></li> <li class="even2"></li> <li class="even2"></li> ......... </ul> ul有N个子元素li(这里只写了3个),如果我要响应每一个li的事件,那么常规的方法就是需要给所有的li都单独绑定一个事件监听,这样写法很符合逻辑,但是同时有显得繁琐 因为li都有一个共同的父元素,而且所有的事件都是一致的,这里我们可以采用要一个技巧来处理,也是常说的"事件委托" 事件没直接和li元素发生关系,而且绑定父元素了。由于浏览器有事件冒泡的这个特性,我们可以在触发li的时候把这个事件往上冒泡到ul上,因为ul上绑定事件响应所以就能够触发这个动作了。唯一的问题怎么才知道触发的li元素是哪个一个? 这里就引出了事件对象了 事件对象是用来记录一些事件发生时的相关信息的对象。事件对象只有事件发生时才会产生,并且只能是事件处理函数内部访问,在所有事件处理函数运行结束后,事件对象就被销毁 回到上面的问题,既然事件对象是跟当前触发元素息息相关的,所以我们就能从里面相关的信息,从事件对象中找到 event.target event.target target 属性可以是注册事件时的元素,或者它的子元素。通常用于比较 event.target 和 this 来确定事件是不是由于冒泡而触发的。经常用于事件冒泡时处理事件委托 简单来说:event.target代表当前触发事件的元素,可以通过当前元素对象的一系列属性来判断是不是我们想要的元素查看全部
-
多个事件绑定同一个函数 $("#elem").on("mouseover mouseout",function(){ }); 通过空格分离,传递不同的事件名,可以同时绑定多个事件 多个事件绑定不同函数 $("#elem").on({ mouseover:function(){}, mouseout:function(){}, });查看全部
-
focus与blur事件:不支持冒泡,focusin与focusout支持冒泡查看全部
-
注意: keydown是在键盘按下就会触发 keyup是在键盘松手就会触发 理论上它可以绑定到任何元素,但keydown/keyup事件只是发送到具有焦点的元素上,不同的浏览器中,可获得焦点的元素略有不同,但是表单元素总是能获取焦点,所以对于此事件类型表单元素是最合适的。查看全部
-
这里需要特别注意: form元素是有默认提交表单的行为,如果通过submit处理的话,需要禁止浏览器的这个默认行为 传统的方式是调用事件对象 e.preventDefault() 来处理, jQuery中可以直接在函数中最后结尾return false即可查看全部
-
注意区分: $(':input')和$('input')查看全部
-
//回车键或者点击提交表单 $('#target1').submit(function(e) { alert('捕获提交表达动作,不阻止页面跳转') }); //回车键或者点击提交表单,禁止浏览器默认跳转: $('#target2').submit(function() { alert('捕获提交表达动作,阻止页面跳转') return false; });查看全部
-
js中事件是会冒泡的,所以this是可以变化的,但event.target不会变化,它永远是直接接受事件的目标DOM元素; .this和event.target都是dom对象查看全部
-
<div id="test">点击触发<div> $("#text").click(11111,function(e) { //this指向 div元素 //e.date => 11111 传递数据 });查看全部
-
$('input:eq(1)').click(1121,function(e){ alert(e.data); }) //不同函数传递数据 function data(e) { alert(e.data) //1111 } function a() { $("button:eq(2)").click(1111, data) } a(); 作用相同,后者只是事先定义一个data函数,后又在click事件中调用这个函数,1111是传入的值,相当于e查看全部
举报
0/150
提交
取消