jquery事件处理 jquery常用事件
本篇文章给大家谈谈jquery事件处理，以及jquery常用事件对应的知识点，文章可能有点长，但是希望大家可以阅读完，增长自己的知识，最重要的是希望对各位有所帮助，可以解决了您的问题，不要忘了收藏本站喔。
jquery中有哪些事件处理程序
bind()向元素添加事件处理程序
blur()添加/触发 blur事件
change()添加/触发 change事件
click()添加/触发 click事件
dblclick()添加/触发 double click事件
delegate()向匹配元素的当前或未来的子元素添加处理程序
die()在版本 1.9中被移除。移除所有通过 live()方法添加的事件处理程序
error()在版本 1.8中被废弃。添加/触发 error事件
event.currentTarget在事件冒泡阶段内的当前 DOM元素
event.data包含当前执行的处理程序被绑定时传递到事件方法的可选数据
event.delegateTarget返回当前调用的 jQuery事件处理程序所添加的元素
event.isDefaultPrevented()返回指定的 event对象上是否调用了 event.preventDefault()
event.isImmediatePropagationStopped()返回指定的 event对象上是否调用了 event.stopImmediatePropagation()
event.isPropagationStopped()返回指定的 event对象上是否调用了 event.stopPropagation()
event.namespace返回当事件被触发时指定的命名空间
event.pageX返回相对于文档左边缘的鼠标位置
event.pageY返回相对于文档上边缘的鼠标位置
event.preventDefault()阻止事件的默认行为
event.relatedTarget返回当鼠标移动时哪个元素进入或退出
event.result包含由被指定事件触发的事件处理程序返回的最后一个值
event.stopImmediatePropagation()阻止其他事件处理程序被调用
event.stopPropagation()阻止事件向上冒泡到 DOM树，阻止任何父处理程序被事件通知
event.target返回哪个 DOM元素触发事件
event.timeStamp返回从 1970年 1月 1日到事件被触发时的毫秒数
event.type返回哪种事件类型被触发
event.which返回指定事件上哪个键盘键或鼠标按钮被按下
event.metaKey事件触发时 META键是否被按下
focus()添加/触发 focus事件
focusin()添加事件处理程序到 focusin事件
focusout()添加事件处理程序到 focusout事件
hover()添加两个事件处理程序到 hover事件
keydown()添加/触发 keydown事件
keypress()添加/触发 keypress事件
keyup()添加/触发 keyup事件
live()在版本 1.9中被移除。添加一个或多个事件处理程序到当前或未来的被选元素
load()在版本 1.8中被废弃。添加一个事件处理程序到 load事件
mousedown()添加/触发 mousedown事件
mouseenter()添加/触发 mouseenter事件
mouseleave()添加/触发 mouseleave事件
mousemove()添加/触发 mousemove事件
mouseout()添加/触发 mouseout事件
mouseover()添加/触发 mouseover事件
mouseup()添加/触发 mouseup事件
off()移除通过 on()方法添加的事件处理程序
on()向元素添加事件处理程序
one()向被选元素添加一个或多个事件处理程序。该处理程序只能被每个元素触发一次
$.proxy()接受一个已有的函数，并返回一个带特定上下文的新的函数
ready()规定当 DOM完全加载时要执行的函数
resize()添加/触发 resize事件
scroll()添加/触发 scroll事件
select()添加/触发 select事件
submit()添加/触发 submit事件
toggle()在版本 1.9中被移除。添加 click事件之间要切换的两个或多个函数
trigger()触发绑定到被选元素的所有事件
triggerHandler()触发绑定到被选元素的指定事件上的所有函数
unbind()从被选元素上移除添加的事件处理程序
undelegate()从现在或未来的被选元素上移除事件处理程序
unload()在版本 1.8中被废弃。添加事件处理程序到 unload事件
contextmenu()添加事件处理程序到 contextmenu事件
$.holdReady()用于暂停或恢复.ready()事件的执行
jquery中有哪些基础事件方法
jquery基础事件，包括绑定事件、简写事件、复合事件；
一．绑定事件
jQuery通过.bind()方法来为元素绑定这些事件。
形式：
bind(type, [data], fn)
参数：
type表示一个或多个类型的事件名字符串；
[data]是可选的，作为 event.data属性值传递一个额外的数据，这个数据是一个字符串、一个数字、一个数组或一个对象；
fn表示绑定到指定元素的处理函数。
二、简写事件
为了使开发者更加方便的绑定事件，jQuery封装了常用的事件以便节约更多的代码。称之为简写事件。简写事件，绑定方法如下图，
三、复合事件
jQuery提供了许多最常用的事件效果，组合一些功能实现了一些复合事件，比如切换功能、智能加载等。
扩展资料
1、绑定事件fn函数
1)使用点击事件
$('input').bind('click', function(){//点击按钮后执行匿名函数
alert('点击！');
});
2)普通处理函数
$('input').bind('click', fn);//执行普通函数式无须圆括号
function fn(){
alert('点击！');
}
2、简写事件函数
1）.mouseover()和.mouseout()表示鼠标移入和移出的时候触发。而.mouseenter()和.mouseleave()表示鼠标穿过和穿出的时候触发。
2）.keydown()、.keyup()返回的是键码，而.keypress()返回的是字符编码。
3）.focus()和.blur()分别表示光标激活和丢失，事件触发时机是当前元素。而.focusin()和.focusout()也表示光标激活和丢失，但事件触发时机可以是子元素。
3、复合事件示例，背景移入移出切换效果
$('div').hover(function(){
$(this).css('background','black');//mouseenter效果
}, function(){
$(this).css('background','red');//mouseleave效果，可省略
});
参考资料
jQuery官方网站-事件
jquery 事件处理 和事件委派的区别
在jquery中有一个很重要的概念——事件委派，相信很多搞前端开发的人都听说过，零度逍遥本来对此不是十分理解，但经过一个高人的指点后，才发现这个功能还是蛮强大的，今天就给大家分享一下。
事件委派的定义就是，把原来加给子元素身上的事件绑定在父元素身上，就是把事件委派给父元素。
说的有点抽象，按照惯例，还是举个例子说明：
这是一个ul，里面包含4个li，如果想要给li加上点击事件，弹出一些内容，我们一般这样写：
$('.list li').click(function(){
alert(1111);
})
这样当我们点击list里面的任何一个li都可以弹出‘1111’，但这样做有两个弊端：
1.很耗费资源，因为这种方式是给每个li都加上了事件，li的个数少的话还没事，如果li多的话会很耗费资源。
2.如果后期动态添加li，不会拥有这个弹出事件。
针对以上问题，可以用事件委派来解决，我们完全可以写出这样一段代码：
代码如下复制代码
$(".list").delegate("li","click", function(){
alert(1111);
});
这个就是jquery的事件委派，有的时候还是很能派上用场的，骚年们，玩起来吧！
.live()与流行的liveQuery插件很像，但有以下几个主要区别：
*.live目前只支持所有事件的子集，支持列表参考上面的说明。
*.live不支持liveQuery提供的“无事件”样式的回调函数。.live只能绑定事件处理函数。
*.live没有"setup"和"cleanup"的过程。因为所有的事件是委派而不是直接绑定在元素上的。
HTML代码:
代码如下复制代码
<p>Click me!</p>
$("p").live("click", function(){
$(this).after("<p>Another paragraph!</p>");
});
事件委派一次绑定多种事件
一次性绑定多个事件，根据事件类别委派相应的操作
为了更好地优化上面的代码，可以通过事件委派来修改代码，修改后的代码如下：
代码如下复制代码
jQuery(function($){
var$liveTip=$('<div id="livetip"></div>').hide().appendTo('body');
var tipTitle='';
$('#mytable').bind('mouseover mouseout mousemove', function(event){
var$link=$(event.target).closest('a');
if(!$link.length){ return;}
var link=$link[0];
if(event.type=='mouseover'|| event.type=='mousemove'){
$liveTip.css({
top: event.pageY+ 12,
left: event.pageX+ 12
});
};
if(event.type=='mouseover'){
tipTitle= link.title;
link.title='';
$liveTip.html('<div>'+ tipTitle+'</div><div>'+ link.href+'</div>')
.show();
};
if(event.type=='mouseout'){
$liveTip.hide();
if(tipTitle){
link.title= tipTitle;
};
};
});
});
该段代码中一次性地将多个事件绑定到一个待处理的DOM对象之上，在代码的内部通过判断事件的类别来委派不同的处理代码。这样可以避免代码的重复定义，以达到避免时间冗余的效果。
事件委派、传递
当列表里的一列被点击，新的列被加入列表。如果想让新加入的列也具有相同的事件控制，我们可以使用事件委派，把事件处理方法传递给新的列。
代码如下复制代码
$(document).ready(function(){
$('#list2').click(function(event){//注意：这里加入了参数：event
var$newLi=$('<li class="special"><button>新按钮</button></li>');
var$tgt=$(event.target);//注意：这里用到target函数
if($tgt.is('button')){
$tgt.parent().after($newLi);
}//这里用到，is()函数来判断当前点击元素的属性，如果是按钮就触发事件。
});
});
jquery事件处理的介绍就聊到这里吧，感谢你花时间阅读本站内容，更多关于jquery常用事件、jquery事件处理的信息别忘了在本站进行查找哦。