jquery绑定,jquery绑定focus事件

jQuery绑定事件on

jQuery中用on来绑定事件,常用写法

成都创新互联公司专注于企业网络营销推广、网站重做改版、衡阳网站定制设计、自适应品牌网站建设、H5网站设计商城网站开发、集团公司官网建设、成都外贸网站建设、高端网站制作、响应式网页设计等建站业务,价格优惠性价比高,为衡阳等各大城市提供网站开发制作服务。

两种写法哪个更好?

1. $(document).on 将事件委托document, $('#idname').on 将事件绑定到.className元素上。每次document有点击动作,浏览器都会判断当前点击的对象。如果匹配再决定要不要执行,多了个判断环节。JS渲染效率很高,所以此异同基本可以忽略。

2. $("className").on 为onclick绑定,只有在页面onload时执行一次。页面刷新后,新加载的具有className的元素便没有事件绑定到上面了。相反$(document).on这种方法会刷新和重新赋予绑定操作,所以一定程度上更为全面。

jQuery事件绑定方法bind,live,delegate和on的区别

bind是用来绑定一个或多个事件的,live其实bind的一个加强版,用来绑定通过JavaScript或者jQuery添加的DOM元素事件,其语法结构是一样

123456$("p").bind("mouseenter mouseleave",function(){alert("ok");})$("p").live("mouseenter mouseleave",function(){alert("ok");})

delegate用于事件委托,也是绑定过JavaScript或者jQuery添加的DOM元素事件。

123$("div").delegate("p","click",function(){alert("p");})

点击div下面的P执行alert;

而on是在1.7之后新增的,是把bind,live,delegate全部合并在一起了,

123$("div").on("click","p",function(){ alert(1); })

不需要事件委托的时候把P去掉就会变成点击div触发了。

个人建议根据版本来使用,语法其实都差不多,如果你是用1.7版本以上就建议用on,毕竟bind,live,delegate这些将来都会遗弃了,如有错误,请指出。顺便吐槽一下楼上的回答,不走心啊

jquery绑定点击事件的方法

jQuery绑定点击事件可以使用其绑定事件函数

jquery中四个事件绑定方式(bind,live,delegate,on)

1、bind()    

简要描述

bind()向匹配元素添加一个或多个事件处理器。

使用方式

$(selector).bind(event,data,function)

event:必需项;添加到元素的一个或多个事件,例如 click,dblclick等;

单事件处理:例如 $(selector).bind("click",data,function);

多事件处理:

1.利用空格分隔多事件,例如 $(selector).bind("click dbclick mouseout",data,function);

2.利用大括号灵活定义多事件,例如 $(selector).bind({event1:function, event2:function, ...}) 

3.空格相隔方式:绑定较为死板,不能给事件单独绑定函数,适合处理多个事件调用同一函数情况;

大括号替代方式:绑定较为灵活,可以给事件单独

绑定函数; 

data:可选;需要传递的参数;

function:必需;当绑定事件发生时,需要执行的函数;

适用Jquery版本

适用所有版本,但是根据官网解释,自从jquery1.7版本以后bind()函数推荐用on()来代替。

2、live()   

简要描述

live() 向当前或未来的匹配元素添加一个或多个事件处理器;

使用方式

$(selector).live(event,data,function)

event:必需项;添加到元素的一个或多个事件,例如 click,dblclick等;

单事件处理:例如 $(selector).live("click",data,function);

多事件处理:1.利用空格分隔多事件,例如 $(selector).live("click dbclick mouseout",data,function);

2.利用大括号灵活定义多事件,例如 $(selector).live({event1:function, event2:function, ...}) 

3.空格相隔方式:绑定较为死板,不能给事件单独绑定函数,适合处理多个事件调用同一函数情况;

大括号替代方式:绑定较为灵活,可以给事件单独绑定函数; 

data:可选;需要传递的参数;

function:必需;当绑定事件发生时,需要执行的函数;

适用Jquery版本

jquery1.9版本以下支持,jquery1.9及其以上版本删除了此方法,jquery1.9以上版本用on()方法来代替。

3、delegate()

简要描述

delegate() 为指定的元素(被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数。使用 delegate() 方法的事件处理程序适用于当前或未来的元素(比如由脚本创建的新元素)。

使用方式 

$(selector).delegate(childSelector,event,data,function)

childSelector: 必需项;需要添加事件处理程序的元素,一般为selector的子元素;

event:必需项;添加到元素的一个或多个事件,例如 click,dblclick等;

单事件处理:例如 $(selector).delegate(childselector,"click",data,function);

多事件处理:1.利用空格分隔多事件,例如 $(selector).delegate(childselector,"click dbclick mouseout",data,function);

2.利用大括号灵活定义多事件,例如 $(selector).delegate(childselector,{event1:function, event2:function, ...}) 

3.空格相隔方式:绑定较为死板,不能给事件单独绑定函数,适合处理多个事件调用同一函数情况;

大括号替代方式:绑定较为灵活,可以给事件单独绑定函数; 

data:可选;需要传递的参数;

function:必需;当绑定事件发生时,需要执行的函数;

适用Jquery版本

jquery1.4.2及其以上版本;

4、on()

简要描述

on() 为指定的元素,添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数。使用 on() 方法的事件处理程序适用于当前或未来的元素(比如由脚本创建的新元素)。

使用方式 

$(selector).on(event,childselector,data,function)

event:必需项;添加到元素的一个或多个事件,例如 click,dblclick等;

单事件处理:例如 $(selector).on("click",childselector,data,function);

多事件处理:1.利用空格分隔多事件,例如 $(selector).on("click dbclick mouseout",childseletor,data,function);

2.利用大括号灵活定义多事件,例如 $(selector).on({event1:function, event2:function, ...},childselector); 

3.空格相隔方式:绑定较为死板,不能给事件单独绑定函数,适合处理多个事件调用同一函数情况;

大括号替代方式:绑定较为灵活,可以给事件单独绑定函数; 

childSelector: 可选;需要添加事件处理程序的元素,一般为selector的子元素;

data:可选;需要传递的参数;

function:必需;当绑定事件发生时,需要执行的函数;

适用Jquery版本

jquery1.7及其以上版本;jquery1.7版本出现之后用于替代bind(),live()绑定事件方式;

四种方式的异同和优缺点

相同点:

1.都支持单元素多事件的绑定;空格相隔方式或者大括号替代方式;

2.均是通过事件冒泡方式,将事件传递到document进行事件的响应;

比较和联系:

1.bind()函数只能针对已经存在的元素进行事件的设置;但是live(),on(),delegate()均支持未来新添加元素的事件设置;

2.bind()函数在jquery1.7版本以前比较受推崇,1.7版本出来之后,官方已经不推荐用bind(),替代函数为on(),这也是1.7版本新添加的函数,同样,可以

用来代替live()函数,live()函数在1.9版本已经删除;

3.live()函数和delegate()函数两者类似,但是live()函数在执行速度,灵活性和CSS选择器支持方面较delegate()差些

4.bind()支持Jquery所有版本;live()支持jquery1.8-;delegate()支持jquery1.4.2+;on()支持jquery1.7+; 

总结

如果项目中引用jquery版本为低版本,推荐用delegate(),高版本jquery可以使用on()来代替,以上仅为个人看法

jquery 如何绑定onkeyup()事件?

首先引入jquery框架,输入代码:

#36(function()#36("textarea[name=phone_about]").keyup(function(){  #36;("#show").text(#36;(this).val().length);  }); })

当然除此之外,还有另外一种代码,适用于某些电脑:

#36;(document).ready(function(){#36;("#phone_about").keyup(function(){#36;("#show").html(#36;(this).val().length); });});textarea id="phone_about" name="phone_about"/textareadiv id="show" style="display:inline;"0/div

选择哪种方法时,应该根据情况而定。

引入相关的js,css。table的html。datatable排序功能被禁用的js, ordering:false(默认情况下为true)。比较一下,如图可以看到, 禁用排序时,排序的箭头没有了。部分禁用排序功能,禁用第二列的排序功能。js如下。(默认排序的总开关开启,所以这里没有在js里设置)。看下效果,第二列排序的箭头没了

jQuery 绑定并实现单击事件

实现的方法如下:

1、第一步,创建一个新的html文件,见下图,转到下面的步骤。

2、第二步,执行完上面的操作之后,创建输入框和按钮,见下图,转到下面的步骤。

3、第三步,执行完上面的操作之后,预览效果见下图,转到下面的步骤。

4、第四步,执行完上面的操作之后,需要引入jquery.js,见下图,转到下面的步骤。

5、第五步,执行完上面的操作之后,设置输入框的keydown事件与click事件,见下图,转到下面的步骤。

6、第六步,执行完上面的操作之后,按钮单击触发事件,见下图,转到下面的步骤。

7、第七步,执行完上面的操作之后,单击按钮,效果见下图。这样,就解决了这个问题了。

当前标题:jquery绑定,jquery绑定focus事件
分享链接:https://www.cdcxhl.com/article10/dsehjgo.html

成都网站建设公司_创新互联,为您提供网站导航手机网站建设网页设计公司网站策划微信小程序小程序开发

广告

声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联

网站建设网站维护公司