jQuery的事件预绑定_jquery

1. 预绑定

首先解释一下什么叫预绑定。预绑定,顾名思义,就是在Web页面上的控件还没出现之前就绑定好事件。预绑定主要是指jQuery中的.on()方法。

2. Demo

HTML代码

<div id="root">
<input type="button" id="test" value="test"/>
</div>

一般的jQuery代码:

$('#root').find('#test').on('click', function() {
...
});

预绑定的jQuery代码:

$('#root').on('click', '#test2', function() {
...
});

jQuery添加控件的代码

$('#root').append('<input type="button" id="test" value="test2"/>')

解释:在页面控件直接显示的情况下,例如'test',上面的两种绑定控件事件的方法都没问题,都可以正常工作,但如果上面的HMTL代码是在模板中,例如jsview中,模板数据不是页面加载时就添加的,或者上面的HTML代码开始不在页面上,是通过jQuery添加的,例如test2是在页面加载之后某个时刻添加的控件,使用一般的绑定控件事件的代码就会有问题,你会发现控件没有绑定事件,而使用预绑定的方法,控件的事件就能绑定上,即使控件是后来添加的。

上面的内容就是jQuery的事件预绑定,jQuery文档地址为:http://api.jquery.com/on/。

以上所述是小编给大家介绍的jQuery的事件预绑定,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索jquery预绑定事件
jquery预绑定
jquery预绑定事件、jquery 绑定click事件、jquery动态绑定事件、jquery 绑定事件、jquery取消绑定事件,以便于您获取更多的相关知识。

时间: 2024-10-03 08:24:28

jQuery的事件预绑定_jquery的相关文章

Jquery注册事件实现方法_jquery

本文实例讲述了Jquery注册事件实现方法.分享给大家供大家参考.具体如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head

jquery 回车事件实现代码_jquery

例子,jquery键盘事件.回车键事件用法. // 键盘事件 1.keydown()  keydown事件会在键盘按下时触发.  2.keyup()  keyup事件会在按键释放时触发,也就是你按下键盘起来后的事件  3.keypress()  keypress事件会在敲击按键时触发,我们可以理解为按下并抬起同一个按键 复制代码 代码如下: // 回车键事件 // 绑定键盘按下事件     $(document).keypress(function(e) {      // 回车键事件     

深入理解jQuery之事件移除_jquery

有时候事件执行完了,想取消事件的效果可以通过一定的办法来处理.比如bind()方法,可以通过unbind()方法来移除事件的效果. 比如下面的一个案例: <script type="text/javascript"> $(function(){ $('#btn').bind("click", function(){ $('#test').append("<p>我的绑定函数1</p>"); }).bind(&qu

解决jquery中事件重复绑定问题

一$.fn.live 重复绑定 解决:使用die()方法,在live()方法绑定前,将此元素上的前面被绑定的事件统统解除,然后再通过live()方法绑定新的事件. //先通过die()方法解除,再通过live()绑定 $("#selectAll").die().live("click",function(){ //事件运行代码 }); 二click等事件 解决:使用unbind("click")方法先解除绑定的事件再绑定新事件,即在给对象绑定事件

初窥JQuery(二) 事件机制(1)_jquery

当然它的优点并不只在于这点,使用JQuery事件处理机制比直接使用Javascript本身内置的一些事件相应方式更加的灵活,更加不容易暴露在外,而且有更加优雅的语法,大大减少了我们工作的量度. JQuery的事件处理机制包括:页面加载.事件绑定.事件委派.事件切换四种机制.我们先从$(document).ready()事件开始. 一.页面加载$(document).ready()相当与Javascript中的onLoad()事件,都是在页面加载的时候执行该方法,但是两者又有着微妙的差别,read

初窥JQuery(二)事件机制(2)_jquery

简单的说Jquery的事件处理机制就相当与在HTML标签中指定各种事件,比如onclick(),keydown()等,在标签中指定事件对应到Javascript的函数,便于我们实现我要求.而JQuery的事件处理则是将这些事件绑定到脚本内部,使我们无须将函数暴露在标签中,而且使用起来非常方便.   在介绍方法之前,我觉得有必要描述一下响应事件的两种策略,一种是事件捕获(Event capturing),一种是事件冒泡(Event bubble),这两种策略是相对立的,它们是在浏览器大战中分别由N

jQuery代码优化 事件委托篇_jquery

jQuery为绑定和委托事件提供了.bind()..live()和.delegate()方法.本文在讨论这几个方法内部实现的基础上,展示它们的优劣势及适用场合. 事件委托 事件委托的事例在现实当中比比皆是.比如,有三个同事预计会在周一收到快递.为签收快递,有两种办法:一是三个人在公司门口等快递:二是委托给前台MM代为签收.现实当中,我们大都采用委托的方案(公司也不会容忍那么多员工站在门口就为了等快递).前台MM收到快递后,她会判断收件人是谁,然后按照收件人的要求签收,甚至代为付款.这种方案还有一

jquery键盘事件使用介绍_jquery

一.首先需要知道的是: 1.keydown() keydown事件会在键盘按下时触发. 2.keyup() keyup事件会在按键释放时触发,也就是你按下键盘起来后的事件 3.keypress() keypress事件会在敲击按键时触发,我们可以理解为按下并抬起同一个按键 二.获得键盘上对应的ascII码: 复制代码 代码如下: $(document).keydown(function(event){ console.log(event.keyCode); }); $tips: 上面例子中,ev

深入理解jQuery事件绑定_jquery

html: <a href="#" onclick="addBtn()">addBtn</a> <div id="mDiv"> <button class="cBtn" onclick="alert(11111)">button1</button> <button class="cBtn">button2</b