<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

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

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

<div>

    <ul>

        <li>1</li>

        <li>2</li>

        <li>3</li>

    </ul>

</div>

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

<script>

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

        var tag = document.createElement('li');

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

        $(tag).text(v);

        $('ul').append(tag);

    });

//    //第一种常见绑定方式，也是最常用的

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

//        alert($(this).text());

//    });

//    //第二种绑定方式 bind有与之对应的unbind

//    $('li').bind('click',function () {

//        alert($(this).text());

//    });

    //第三种绑定方式,功能很强大，可以让之后新添加的标签也有单击事件

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

        alert($(this).text());

    });

//   //第四种绑定方式 on 其实以上三种方式都是通过包装on实现的

//    $('li').on('click',function () {

//        alert($(this).text());

//    });

</script>

</body>

</html>

　　

jQuery 事件绑定四种方式，delegate委托强大绑定在3.0中修改为on的更多相关文章

  1. jQuery绑定事件的四种方式：bind、live、delegate、on

    1.jQuery操作DOM元素的绑定事件的四种方式 jQuery中提供了四种事件监听方式,分别是bind.live.delegate.on,对应的解除监听的函数分别是unbind.die.undele ...

  2. android点击事件的四种方式

    android点击事件的四种方式 第一种方式:创建内部类实现点击事件 代码如下: package com.example.dail; import android.text.TextUtils; im ...

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

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

  4. jQuery绑定事件的四种方式区别

    jQuery中提供了四种事件监听方式,分别是bind.live.delegate.on,对应的解除监听的函数分别是unbind.die.undelegate.off.在开始看他们之前 一:bind(t ...

  5. ASP.NET MVC之下拉框绑定四种方式（十）

    前言 上两节我们讲了文件上传的问题,关于这个上传的问题还未结束,我也在花时间做做分割大文件处理以及显示进度的问题,到时完成的话再发表,为了不耽误学习MVC其他内容的计划,我们今天开始好好讲讲关于MVC ...

  6. SWT组件添加事件的四种方式

    在我们CS日常开发过程中会经常去为组件添加事件,我们常用的为AWT与SWT.SWT的事件模型是和标准的AWT基本一样的.下面将按照事件的四种写法来实现它. 一.匿名内部类的写法 new MouseAd ...

  7. Java添加事件的四种方式

    Java添加事件的几种方式(转载了codebrother的文章,做了稍微的改动) /** * Java事件监听处理——自身类实现ActionListener接口,作为事件监听器 * * @author ...

  8. Android按钮绑定四种方式

    public class MainActivity extends Activity implements OnClickListener{ @Override protected void onCr ...

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

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

随机推荐

  1. iOS原生和React-Native之间的交互2

    今天看下iOS原生->RN: 这里有个问题: * 我这里只能通过rn->ios->rn来是实现* 如果想直接ios-rn 那个iOS中的CalendarManager的self.br ...

  2. MySQL笔记（2）

    SQL 的约束 约束是一种限制,它通过对表的行或列的数据做出限制,来确保表的数据的完整性.唯一性.. 1 约束分类 约束是一种限制,它通过对表的行或列的数据做出限制,来确保表的数据的完整性.唯一性. ...

  3. 2.4 CSS定位

    前言 大部分人在使用selenium定位元素时,用的是xpath定位,因为xpath基本能解决定位的需求.css定位往往被忽略掉了,其实css定位也有它的价值,css定位更快,语法更简洁.这一篇css ...

  4. 关于Adaboost——样本抽样的权值的实际意义

    看这篇文章的前提:已经看了PRML中的Adaboost的算法流程 看懂下面的内容必须牢牢记住:Adaboost使用的误差函数是指数误差 文章主要目的:理解样本抽样的权值是为什么那样变化的. 得出的结论 ...

  5. Gym-101653:acific Northwest Regional Contest （2019训练第一场）

    本套题没有什么数据结构题,图论题,唯一有价值的就是Q题博弈,在最后面,读者可以直接拉到最下面. (还剩下两个,估计每什么价值的题,懒得补了 M .Polyhedra pro:欧拉公式,V-E+F=2: ...

  6. 【转】matlab的textscan与textread区别

    1.基本语法textscan的基本语法是:C = textscan(fid, 'format') C = textscan(fid, 'format', N) 其中fid为fopen命令返回的文件标识 ...

  7. Mysql的两种引擎

    Innodb引擎: 1.Innodb引擎提供了对数据库ACID事务的支持,并且实现了SQL标准的四种隔离级别 2.该引擎还提供了行级锁和外键约束,它的设计目标是处理大容量数据库系统,它本身其实就是基于 ...

  8. Android 播放内部mp3音乐

    private void heartSound() { try { AssetManager am = getAssets();//获得该应用的AssetManager AssetFileDescri ...

  9. Commons工具包的使用

    使用步骤: 1.Java  Project下新建Folder文件夹,命名lib 2.lib文件夹下把Commons-io-2.4jar包复制进去 3.右键Commons-io-2.4jar包,点击Bu ...

  10. <------------------字节流--------------------->

    字节流: 输入和输出:1.参照物都是java程序来惨遭 2.Input输入,持久化上的数据---->内存 3.Output输出,内存--->硬盘 字节输出流: OutputStream: ...