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. 【洛谷P4556】 雨天的尾巴

    题面 题解 线段树合并 我们看到这道题目首先可以想到树上差分,然后\(dfs\)合并 发现题目让我们求的东西很好用线段树维护 于是可以想到线段树合并 全世界只有我写指针版动态开点线段树(大雾 如果你要 ...

  2. 查询数据库所有表和字段及其注释（mysql）

    #查询某个库所有表 select * from information_schema.TABLES where table_schema = '数据库' #查询某个库所有表的字段 select * f ...

  3. 深入解析QML引擎, 第3部分: 绑定类型

    原文 QML Engine Internals, Part 3: Binding Types 译者注:这个解析QML引擎的文章共4篇,分析非常透彻,在国内几乎没有找到类似的分析,为了便于国内的QT/Q ...

  4. C# 多线程的等待所有线程结束的一个问题

    1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 3 ...

  5. python-面向对象-内置方法补充

    __del__item系列 __getitem__ __setitem__ __delitem____hash____eq__ 构造方法 申请一个空间析构方法 释放一个空间之前执行某对象借用了操作系统 ...

  6. 记录阿里云ECS(Centos7.4)安装mysql 8.0.X服务

    #*.rpm介绍 大多数二进制rpm包都包含在名称中倒数第二个字段中编译rpm的体系结构..rpm软件包有那么几种 *.src.rpm 源程序包,要先通过编译才能安装 *.noarch.rpm 该包适 ...

  7. Linux 安装Redis<集群版>(使用Mac远程访问)

    阅读本文需要先阅读安装Redis<准备> 一 架构细节 所有的redis节点彼此互联(PING-PONG机制) 内部使用二进制协议优化传输速度和带宽 节点的fail是通过集群中超过半数的节 ...

  8. 实现短信超链接调起APP

    因APP推广的需求,需要给APP用户定期发送短信提醒登录使用,为了更好的用户体验在短信内容中嵌入了可以直接打开APP的超链接,下面介绍一下具体的代码实现. 编辑openApp.html文件: < ...

  9. 实现属于自己的TensorFlow(一) - 计算图与前向传播

    前段时间因为课题需要使用了一段时间TensorFlow,感觉这种框架很有意思,除了可以搭建复杂的神经网络,也可以优化其他自己需要的计算模型,所以一直想自己学习一下写一个类似的图计算框架.前几天组会开完 ...

  10. [linux] vim在源代码中自动添加作者信息（转载）

    原文出处: http://www.vimer.cn/2009/10/用vim在源代码中添加你的个人信息.html vim ~/.vimrc "进行版权声明的设置 "添加或更新头 m ...