jquery事件绑定

.bind()   为一个元素绑定一个元素处理程序。   .bind(eventType[,eventData],handler(eventObject))     eventType       一个包含一个或多个DOM事件类型的字符串,或自定义事件的名称。     eventData       一个对象,它包含的数据键值对映射将被传递给事件处理程序。     handler(eventObject)       每当事件触发时执行的函数。   .bind(eventType[,eventData],preventBubble)     eventType       一个包含一个或多个DOM事件类型的字符串,或自定义事件的名称。     eventData       一个对象,它包含的数据键值对映射将被传递给事件处理程序。     preventBubble       第三个参数设置为false 将绑定一个函数。防止默认事件,阻止事件冒泡,默认值是true。   .bind(events)     events       一个对象,包含一个或多个DOM事件类型或函数执行他们。

  用法:     $('#foo').bind('click', function() {       alert('User clicked on "foo."');     }); //当点击#foo这个元素的时候弹出 这句话。

    $('#foo').bind('mouseenter mouseleave', function() {       $(this).toggleClass('entered');     }); // 一次可以绑定多个 事件,用逗号隔开,

.delegate()   为所有匹配选择器的元素绑定一个或者多个事件处理函数,基于一个指定的根元素的子集,匹配的元素包括那些匹配到的元素,也包括那些今后可匹配的元素。   .delegate(eventType[,eventData],handler(eventObject))     eventType       一个包含一个或多个DOM事件类型的字符串,或自定义事件的名称。     eventData       一个对象,它包含的数据键值对映射将被传递给事件处理程序。     handler(eventObject)       每当事件触发时执行的函数。   .delegate(selector,eventType,eventData,handler(eventObject))     selector       选择器字符串,用于过滤器触发事件的元素。     eventType       一个包含一个或多个DOM事件类型的字符串,或自定义事件的名称。     eventData       一个对象,它包含的数据键值对映射将被传递给事件处理程序。     handler(eventObject)       每当事件触发时执行的函数。   .delegate(selector,events)     selector       选择器字符串,用于过滤器触发事件的元素。     events       一个对象,包含一个或多个DOM事件类型和函数并执行它们。     使用方法:       $("table").delegate("td", "click", function() {         alert($(this).text());       });         每当td的文字被点击时候,要显示一个警告框:       $("body").delegate("a", "click", function() { return false; })           返回false,取消默认的行为,防止从它冒出来的,:       $("body").delegate("a", "click", function(event){           event.preventDefault();       });         要取消默认动作只有通过使用preventDefault方法。

.die()   从元素中删除先前.live()绑定的所有事件。   .die()     这个方法不接受任何参数。   .die(eventType[,handler])     eventType       一个包含一个JavaScript事件类型的字符串,比如click 或keydown。     handler       将来不用执行的函数。   .die(events)       events         包含一个或多个事件类型的一个普通对象.   用法:     $("p").die()       解除所有段落上绑定的live 事件。     $("p").die("click")       解除所有段落上通过live事件绑定的click 事件。

.off()   移除一个事件处理函数。   .off(events[,selector][,handler])     events       一个或多个空格分隔的事件类型和可选的命名空间     selector       一个选择器,当绑定事件处理程序时匹配最初传递给     handler       以前附加的事件处理函数.   .off(events[,selector])     events       一个对象的字符串所代表的一个或多个空格的事件类型和可命名的空间。     selector       一个选择器,当绑定事件处理程序的匹配最初传递给。   .off(event)     event       一个jqery.event对象。   .off()     这个方法不接受任何参数。

  用法:     $("p").off()       移除所有段落上的事件:     $("p").off( "click", "**" )       移除所有段落上的代理事件:

.on()   在选定的元素上绑定一个或多个事件处理函数。   .on(events[,selector][data],handler(eventObject))     events       一个或多个空格分隔的事件类型和可选的命名空间,或仅仅是命名空间,比如"click",     selector       一个选择器字符串,用于过滤出被选中的元素中能触发事件的后代元素。     data       当一个事件被触发时,要传递给事件处理函数的event.data。     handler       事件被触发时,执行的函数。   .on( events [, selector ] [, data ] )     events       一个对象,键是由一个或多个由空格分隔的事件类型及可选的名字空间,值是这些事件类型所对应的事件处理函数。     selector       一个选择器字符串,用于过滤出被选中的元素中能触发事件的后代元素。     data       当一个事件被触发时,要传递给事件处理函数的event.data。   用法:     $('p').on("click",function(){       alert($(this).text());     }) //当点击段落的时候,显示该段落中的文本。

    $('form').on("submit",false)       //取消表单的提交动作。

    $("form").on("submit",function(event){        event.preventDefault();     }) // 通过使用.preventDefault() 仅取消默认的动作。

    $("div").on("click",function(event,person){         alert("Hello,"+person.name);      }) //传递一个data数据给事件处理程序,作为第二个参数。

    $("body").on("click","p"function(){         alert($(this).text());       }) // 当点击该段落时候,显示该段落的文本。

.one()   为一个元素的事件添加处理函数,处理函数在每个元素上每种事件类型最多执行一次。   .one(events[,data],handler(eventObject))     events       一个包含一个JavaScript事件类型的字符串,比如click;     data       一个对象,它包含的数据键值对映射将被传递给事件处理程序。     handler(eventObject)       每次事件触发时会执行的函数。     用法:     $( "#foo" ).one( "click", function() {       alert( "This will be displayed only once." );     }); //第一次点击该段落的时候会 弹出警示框。

.trigger()   根据绑定到匹配元素的给定的事件类型执行所有的处理程序和行为。   .trigger(eventType[,extraParameters])     eventType       一个包含一个JavaScript事件类型的字符串,比如click;     extraParameters       传递给事件处理程序的额外参数。   .trigger(event[,extraParameters])     event       一个jquery.event对象。     extraParameters       传递给事件处理程序的额外参数。   用法:    $('#foo').on('click', function() {     alert($(this).text());     });     若要提交第一个表单但又不想使用 submit() 函数,请尝试如下方法:     $("form:first").trigger("submit");     .triggerHandler()         为一个事件执行附加到元素的所有处理程序。     .triggerHandler( eventType [, extraParameters ] )       eventType         以后包含JavaScript事件类型的字符串,比如click 或 submit。       extraParameters         传递给事件处理程序的额外参数。     .triggerHandler(event[,extraParameters])       event         一个 jQuery .Event 对象.       extraParameters         传递给事件处理程序的额外参数。       $("#old").click(function(){           $("input").trigger("focus");        }); //当点击了这个元素才会触发input 的获得焦点事件。

.unbind()   从元素上删除一个以前附加事件处理程序。   .unbind(eventType[,handler])     eventType       一个包含JavaScript事件类型的字符串,比如click 或 submit。     handler       这个函数今后不在执行。   .unbind(eventType,false)     eventType       一个包含JavaScript事件类型的字符串,比如click 或 submit。     false       解除绑定相应的'return false'函数,这个函数使用.bind( eventType,false )绑定。   .unbind(event)     一个jquery.event对象。   .unbind()     此签名不接受任何参数。   用法:     $('#foo').unbind();       //删除所有事件类型的处理程序。     $('#foo').unbind('click')       //删除所有点击事件。   .undelegate()     删除当前选择器匹配的所有元素的事件处理程序,根据组特定根元素的集合。   .undelegate( selector, eventType )     selector       选择器字符串,用于过滤器触发事件的元素。     eventType       一个包含一个或多个用空格隔开的JavaScript事件类型的字符串,比如"click"或"keydown"。   .undelegate( selector, eventType, handler(eventObject) )     selector       选择器字符串,用于过滤器触发事件的元素。     eventType       一个包含一个或多个用空格隔开的JavaScript事件类型的字符串,比如"click"或"keydown"。     handler(eventObject)       每当事件触发时执行的函数。   .undelegate( selector, events )     selector       选择器字符串,用于过滤器触发事件的元素。     events       一个或多个事件类型和以前绑定的函数组成的一个对象,用来以解除他们(处理程序)。   .undelegate( namespace )     namespace       一个字符串,其中包含一个命名空间,以解除所有事件。   用法:     解除绑定的所有段落都从委托的事件:       $("p").undelegate()     解除绑定的所有段落的所有委托点击事件:       $("p").undelegate( "click" )

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏前端大白专栏

关于css选择器的问题 + * ~这三个有什么区别

1774
来自专栏phodal

WebStorm重构快捷键

JavaScript重构 结合 快捷键 是真正的神器。 ? 按下Command + Option + Shift + T,会有重构的菜单出现 ? 重构之前...

5325
来自专栏Angular&服务

数据绑定

1143
来自专栏栗霖积跬步之旅

1.react的基础知识

React 的基础之:JSX 语法 react 使用 JSX 语法,js 代码中可以写 HTML 代码。 let myTitle = <h1>Hello, Wo...

2856
来自专栏JavaEE

jQuery入门前言

上次说到了JavaScript,对其有一定了解,本文就来说说jQuery。jQuery就是一个由JavaScript编写的轻量库,简单的说就是封装了一些Java...

973
来自专栏Python

Django比较相等或者不相等的模板语法ifequal / ifnotequal

ifequal / ifnotequal      在模板语言里比较两个值并且在他们一致的时候显示一些内容,Django提供了 ifequal 和 ifnote...

3216
来自专栏Ryan Miao

java变量的加载顺序

学习编程思想 1 package com.test.java.classs; 2 3 /** 4 * Created by Administrato...

2569
来自专栏程序员的知识天地

H5学习从0到1-H5的块标签的使用(9)

713
来自专栏WebDeveloper

使用css3属性处理单词的换行和断词

1963
来自专栏前端布道

Angular开发实践(七): 跨平台操作DOM及渲染器Renderer2

在《Angular开发实践(六):服务端渲染》这篇文章的最后,我们也提到了在服务端渲染中需要牢记的几件事件,其中就包括不要使用window、 document、...

4129

扫码关注云+社区

领取腾讯云代金券