1.事件绑定的方式

事件

	DOM:三种绑定方式

	jQuery:

		#前面几种内部调用的全是on

		$('.c1').click()
　　　　　　　　　 $('.c1').blur()
　　　　　　　　　$('.c1').aaaaa()

		$('.c1').bind('click',function(){})

		$('.c1').unbind('click',function(){})

		$('.c1').delegate('a','click',function(){}) #不同于其它，有委托的作用。  .c1 下面所有的a 标签都绑定click事件。

		$('.c1').undelegate('a','click',function(){})

		
　　　　　　　　　　$('.c1').on('click',function(){})

		$('.c1').off('click',function(){})

2. 由于程序是从上往下执行，所以对新输入的值没有绑定alert事件。

delegate 从上往下执行的时候，还没有绑定事件。直到真正点击它的时候，才绑定并且执行。

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

    <input id="t1" type="text"/>

    <input id="a1" type="button" value="添加"/>

    <ul id="ul">

        <li>123</li>

        <li>456</li>

    </ul>

    <script src="jquery-1.12.4.js"></script>

    <script>

        $('#a1').click(function(){

            var v=$('#t1').val();

            var temp="<li>"+v+"</li>";

            $('#ul').append(temp);

        });

        $('ul li').click(function(){

            v=$(this).text();

            alert(v);

        })

    </script>

</body>

</html>

所以需要重新绑定

3. delegate具有委托的作用，不同于其它几个。

click不行，bind不行，on不行，delegate可以。委托。

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

    <input id="t1" type="text"/>

    <input id="a1" type="button" value="添加"/>

    <ul id="ul">

        <li>123</li>

        <li>456</li>

    </ul>

    <script src="jquery-1.12.4.js"></script>

    <script>

        $('#a1').click(function(){

            var v=$('#t1').val();

            var temp="<li>"+v+"</li>";

            $('#ul').append(temp);

        });

        $('ul').delegate('li','click',function(){

            v=$(this).text();

            alert(v);

        })

    </script>

</body>

</html>

jQuery绑定事件的更多相关文章

  1. jQuery绑定事件-多种方式实现

    jQuery绑定事件-多种方式实现: <html> <head> <meta charset="utf-8" /> <script src ...

  2. jQuery绑定事件的四種方式

    这篇文章主要介绍的是jQuery绑定事件的四种方式相关内容,下面我们就与大家一起分享. jQuery绑定事件的四种方式 jQuery提供了多种绑定事件的方式,每种方式各有其特点,明白了它们之间的异同点 ...

  3. jQuery绑定事件的on()

    jQuery绑定事件 语法:$(selector).on(event,childselector,function(){}); 可以为自身的加事件(一个或多个)  也可以为其子元素加事件(一个或多个) ...

  4. js进阶---12-10、jquery绑定事件和解绑事件是什么

    js进阶---12-10.jquery绑定事件和解绑事件是什么 一.总结 一句话总结:on和off. 1.jquery如何给元素绑定事件? on方法 22 $('#btn1').on('click', ...

  5. Jquery绑定事件及动画效果

    Jquery绑定事件及动画效果 本文转载于:https://blog.csdn.net/Day_and_Night_2017/article/details/85799522 绑定事件 bind(ty ...

  6. 关于jquery绑定事件执行两次

    经常会出现jquery绑定事件执行两次的情况,如: $("a[tag=slide]").click(function () { alert(1); $(this).parent() ...

  7. jquery绑定事件时如何向事件函数里传参数

    jquery绑定事件时如何向事件函数里传参数 jquery绑定事件时如何向事件函数里传参数 举例子说明: 步骤1: var button=$('<button type="button ...

  8. 原生JS事件绑定方法以及jQuery绑定事件方法bind、live、on、delegate的区别

    一.原生JS事件绑定方法: 1.通过HTML属性进行事件处理函数的绑定如: <a href="#" onclick="f()"> 2.通过JavaS ...

  9. jQuery绑定事件的四种方式

      jQuery提供了多种绑定事件的方式,每种方式各有其特点,明白了它们之间的异同点,有助于我们在写代码的时候进行正确的选择,从而写出优雅而容易维护的代码.下面我们来看下jQuery中绑定事件的方式都 ...

  10. jquery 绑定事件的方法

    jQuery中提供了四种绑定事件的方法,分别是bind.live.delegate.on,对应的解除监听的函数分别是unbind.die.undelegate.off: 一.on()方法(首选方法) ...

随机推荐

  1. 【BZOJ2395】[Balkan 2011]Timeismoney

    [BZOJ2395][Balkan 2011]Timeismoney 题面 \(darkbzoj\) 题解 如果我们只有一个条件要满足的话直接最小生成树就可以了,但是现在我们有两维啊... 我们将每个 ...

  2. 【LG4631】[APIO2018]Circle selection 选圆圈

    [LG4631][APIO2018]Circle selection 选圆圈 题面 洛谷 题解 用\(kdt\)乱搞剪枝. 维护每个圆在\(x.y\)轴的坐标范围 相当于维护一个矩形的坐标范围为\([ ...

  3. 搜索引擎Solr6.2.1 索引富文本(word/pdf/txt/html)

    一:首先建立Core 在core下面新建lib文件夹,存放相关的jar包,如图所示: lib文件夹打开所示,这些类库在solr6.2.1解压之后都能找到: 修改solrconfig.xml,把刚刚建的 ...

  4. textbox的验证

    代码如下: textBox1.KeyDown += (a, b) => { if (b.KeyCode == Keys.Enter) { textBox2.Focus(); } }; textB ...

  5. Python接口测试实战5（上） - Git及Jenkins持续集成

    如有任何学习问题,可以添加作者微信:lockingfree 课程目录 Python接口测试实战1(上)- 接口测试理论 Python接口测试实战1(下)- 接口测试工具的使用 Python接口测试实战 ...

  6. Mysql 单表主从同步

    先配主从同步,后将主库表老数据传输到从库 说明:api-server的数据库为主,其他harbor为从 1.master 配置文件更改 [mysqld] log-bin = mysql-bin ser ...

  7. Pyhone学习之环境搭建

    一.python 环境搭建 本章节我们将向大家介绍如何在本地搭建Python开发环境.Python可应用于多平台包括 Linux 和 Mac OS X.你可以通过终端窗口输入 "python ...

  8. 联邦快递 IE和IP的区别 Fedex IE VS Fedex IP

    什么是FedEx IP? FedEx IP指的是联邦快递优先服务,时效比较快些,相对来说价格也比普通的高一些. 什么是FedEx IE? FedEx IE指的是联邦快递经济服务,时效与FedEx IP ...

  9. python基础知识-01-编码输入输出变量

    python其他知识目录 名词解释: 编辑器 ide 程序员 操作系统 ASCAII码 unicode utf-8 浅谈CPU.内存.硬盘之间的关系 操作系统及Python解释器工作原理讲解 关于编译 ...

  10. Python爬虫入门（7）：正则表达式

    下面就开始介绍一个十分强大的工具,正则表达式! 1.了解正则表达式 正则表达式是对字符串操作的一种公式,就是用事先定义好的一些特定字符.及这些特定字符的组合,组成一个“规则字符串”,这个“规则字符串” ...