标签:
Jquery 事件
在javascript中事件调用方式为onclick、onmouseover等,在jquery中 使用事件无需写前面的on
bind()方法
为元素绑定事件
$("#id").bind("click",function(){
//为id绑定click事件
alert("ok");
});
使用bind()方法绑定的事件,是多播事件委托,就是再次定义的事件不会覆盖前一个事件
//可以按顺序执行两个事件
$("#id").bind("click",function(){alert("1");});
$("#id").bind("click",function(){alert("2")});
one()方法
绑定一次性事件
//只执行一次单击操作 下次不会再执行
$("#id").one("click",function(){
alert("a");
return false;
});
unbind()方法
删除事件,取消绑定
$("#id").unbind(); //删除id的所有事件
$("#id").unbind("click"); //删除id的所有click事件
快捷事件
javascript事件去掉on基本都支持
click()方法
单击事件
$("#id").click(); //如果不写函数体 表示立即触发事件
$("#id").click(function(){
//这是一个点击事件
});
dbclick()方法
双击事件
$("#id").dbclick(); //触发事件
$("#id").dbclick(function(){
//双击后执行
});
focus()方法
获得焦点
$("#id").focus(); //触发
$("#id").focus(function(){
//获得焦点后执行
});
blur()方法
失去焦点
$("#id").blur(); //触发失去焦点事件
$("#id").blur(function(){
//失去焦点后执行
});
change()方法
改变时
$("#id").change(); //触发改变事件
$("#id").change(function(){
//改变后执行
});
mouseover()方法
鼠标移入
$("#id").mouseover();
$("#id").mouseover(function(){});
mouseout()方法
鼠标移出
$("#id").mouseout();
$("#id").mouseout(function(){});
submit()方法
提交表单
$("#id").submit();
$("#id").submit(function(){});
hover()方法
用于解决mouseover和mouseout存在的问题
//两个function 分别对应移入和移出
$("div").hover(function(){
$("div").html("啊啊啊啊啊啊啊 快跑啊他来了");
},function(){
$("div").html("呼、吓死了 终于走了!")
});
toggle()方法
依次执行每个函数,如果执行完毕重复执行
$("#div").toggle(
function(){
$("#div").css({ "width": "100px" });
},
function(){
$("#div").css({ "width": "200px" });
},
function(){
$("#div").css({ "width": "300px" });
}
);
Jquery 事件对象
Jquery event将不同浏览器的差异进行了合并,比如可以在所有浏览器中都使用event.target来获取触发者而不用判断浏览器使用srcElement。
$("#div").click(function(e){
alert(e.type); //返回事件名 click
alert(e.target); //返回事件源 谁触发的
alert(e.altKey); //返回alt是否按下
alert(e.screenX);//...等等 js中的事件
});