一、jQuery事件

方法	描述	执行时机
click()	触发或将函数绑定到指定元素的click事件	单击鼠标时
dblclick()	触发或将函数绑定到指定元素的dblclick事件	双击鼠标时
mouseover()	触发或将函数绑定到指定元素的mouseover事件	鼠标移过时
mouseout()	触发或将函数绑定到指定元素的mouseout事件	鼠标移出时
hover()	当鼠标移动到元素上时，会触发指定的第一个函数(mouseenter);<br/> 当鼠标移出这个元素时，会触发指定的第二个函数(mouseleave)	鼠标移入移出

二、事件绑定

bind绑定事件

语法：

//第一个参数：事件类型
//第二个参数：事件处理程序
$("p").bind("click",function(){
//事件响应方法
)

缺点：不支持动态事件绑定

 // 第一种 bind（事件类型，事件处理函数）$("div").bind("click", function () {$(this).css("background-color", "green")})$("div").bind("mouseover", function () {$(this).css("background-color", "pink")})$("div").bind("mouseout", function () {$(this).css("background-color", "red")})

on绑定事件

语法：

//第一个参数: events，绑定事件的名称可以是由空格分隔的多个事件（标准事件或者自定义事件)
//第二个参数: selector，执行事件的后代元素（可选)，如果没有后代元素，那么事件将有自己执行。
//第三个参数: data，传递给处理函数的数据，事件触发的时候通过event.data来使用（不常使用)
//第四个参数: handler，事件处理函数
$(selector).on(events[,selector] [,data] , handler) ;

 //第二种  一次绑定多个事件.on进行事件绑定时可以实现动态绑定$("div").on({"click": function () {$(this).css("background-color", "green")},"mouseover": function () {$(this).css("background-color", "pink")},"mouseout": function () {$(this).css("background-color", "red")}})

三、事件解绑

unbind方式(不用)与bind对应

$(selector). unbind();//解绑所有的事件
$(selector). unbind("click");//解绑指定的事件

undelegate方式(不用)与delegate对应

$( selector ).undelegate();//解绑所有的delegate事件
$( selector) .undelegate( "click”);/ /解绑所有的click事件

off方式(推荐)与on对应

//解绑匹配元素的所有事件$(selector). off();
//解绑匹配元素的所有click事件
$(selector). off("click ");

jQuery事件绑定与解绑相关推荐

jQuery的绑定与解绑方法
jQuery的4种绑定方法一.bind()与unbind() I.bind():绑定 1.定义 2.语法 3.参数 4.案例 (1)绑定单一事件 (2)绑定多个事件 II.unbind():解绑 1 ...
js元素事件绑定与解绑兼容代码
一.元素事件的绑定方法兼容代码为任意元素绑定任意事件的兼容代码 /*** 为任意元素绑定任意事件* @param {*} element 元素* @param {*} type 事件类型* @par ...
Vue 事件绑定与解绑
目录事件绑定基础知识使用场景注意事项 v-on 绑定事件语法实例 $ref绑定事件语法实例事件解绑语法实例事件绑定基础知识使用场景子组件==>父组件传数据在父组件 ...
组件的自定义事件(绑定、解绑)
温馨提示:总结在最下方,如若不想看代码,请滚动至最下方查看相关知识点,谢谢! App.vue <template><div class="app">< ...
JQuery_003_事件绑定与解绑
$(function () {//第一个按钮通过on的方式绑定点击事件$("#btn1").on("click",function () {alert(&quo ...
js 事件（绑定、解绑、三个阶段、相关方法）
事件绑定与解绑: DOM0级事件(这类事件可以使用 return false来阻止事件往下执行,包含默认事件) 绑定: html内<input οnclick=''> js中el.οncl ...
jQuery 事件用法详解
目录简介实现原理事件操作绑定事件解除事件触发事件事件委托事件操作进阶阻止默认事件阻止事件传播阻止事件向后执行命名空间自定义事件事件队列 jquery中文文档简介 jque ...
JQuery事件绑定解绑方法小结
常用的方法绑定:bind().delegate().on() 解绑:unbind().undelegate().off() 此外还有live() 不过JQuery1.9及其以上版本删除了此方法推荐 ...
vue：组件自定义事件、绑定、解绑事件
vue:组件自定义事件.绑定.解绑事件自定义组件绑定事件: 使用方法:在引入组件中的methods定义一个回调方法,在组件标签中使用如下两种方式自定义事件,去到引入的组件的中,使用 this.$em ...

jQuery事件绑定与解绑

一、jQuery事件

二、事件绑定

三、事件解绑

jQuery事件绑定与解绑相关推荐

最新文章

热门文章