jQuery 事件绑定四种方式,delegate委托强大绑定在3.0中修改为on
<!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的更多相关文章
- jQuery绑定事件的四种方式:bind、live、delegate、on
1.jQuery操作DOM元素的绑定事件的四种方式 jQuery中提供了四种事件监听方式,分别是bind.live.delegate.on,对应的解除监听的函数分别是unbind.die.undele ...
- android点击事件的四种方式
android点击事件的四种方式 第一种方式:创建内部类实现点击事件 代码如下: package com.example.dail; import android.text.TextUtils; im ...
- jQuery绑定事件的四种方式
jQuery提供了多种绑定事件的方式,每种方式各有其特点,明白了它们之间的异同点,有助于我们在写代码的时候进行正确的选择,从而写出优雅而容易维护的代码.下面我们来看下jQuery中绑定事件的方式都 ...
- jQuery绑定事件的四种方式区别
jQuery中提供了四种事件监听方式,分别是bind.live.delegate.on,对应的解除监听的函数分别是unbind.die.undelegate.off.在开始看他们之前 一:bind(t ...
- ASP.NET MVC之下拉框绑定四种方式(十)
前言 上两节我们讲了文件上传的问题,关于这个上传的问题还未结束,我也在花时间做做分割大文件处理以及显示进度的问题,到时完成的话再发表,为了不耽误学习MVC其他内容的计划,我们今天开始好好讲讲关于MVC ...
- SWT组件添加事件的四种方式
在我们CS日常开发过程中会经常去为组件添加事件,我们常用的为AWT与SWT.SWT的事件模型是和标准的AWT基本一样的.下面将按照事件的四种写法来实现它. 一.匿名内部类的写法 new MouseAd ...
- Java添加事件的四种方式
Java添加事件的几种方式(转载了codebrother的文章,做了稍微的改动) /** * Java事件监听处理——自身类实现ActionListener接口,作为事件监听器 * * @author ...
- Android按钮绑定四种方式
public class MainActivity extends Activity implements OnClickListener{ @Override protected void onCr ...
- jQuery绑定事件的四種方式
这篇文章主要介绍的是jQuery绑定事件的四种方式相关内容,下面我们就与大家一起分享. jQuery绑定事件的四种方式 jQuery提供了多种绑定事件的方式,每种方式各有其特点,明白了它们之间的异同点 ...
随机推荐
- 【摄像头】Global Shutter(全局快门)与Rolling Shutter(卷帘快门)的区别与比较
由于红外补光灯的爆闪,所以一般DMS会用global shutter的sensor,而不是rolling shutter的. 参考 1. Global Shutter(全局快门)与Rolling Sh ...
- 【leetcode】278. First Bad Version
problem 278. First Bad Version solution1:遍历: // Forward declaration of isBadVersion API. bool isBadV ...
- flask中的request和response
1.request 1.request的常用成员 1.scheme : 获取请求方案(协议) 2.method : 获取本期请求的请求方式(重点) 3.args : 获取使用get请求方式提交的数据 ...
- 20155219&20155224 《信息安全系统设计基础》实验二 固件程序设计
实验二 固件程序设计-1-MDK 0. 注意不经老师允许不准烧写自己修改的代码 1. 两人(个别三人)一组 2. 参考云班课资源中"信息安全系统实验箱指导书.pdf "第一章,1. ...
- Java异常处理的方法
1.异常概述在程序中,错误可能产生于程序员没有预料到的各种情况,或者是超出了程序员可控制范围的环境因素,如用户的坏数据.试图打开一个根本不存在的文件等.在Java中这种在程序运行是可能出现的一些错误称 ...
- eclipse + python + pydev
工具:eclipse-nion.jdk8.python3.6.pydev eclipse -> help -> eclipse marketplace -> 输入 python,in ...
- PS学习之小猪佩奇身上纹,掌声送给社会人
首先准备素材 用ps首先打开素材一 首先对图片去色 快捷键:shift+Ctrl+u 调整色阶 设置高斯模糊: 另存为psd格式,命名为叠加的对象 再次打开素材一,把佩奇拖入到图层里,并调整大小,旋转 ...
- 【挑战赛16A】【取石子】【组合数学】
链接:https://www.nowcoder.com/acm/contest/113/A 来源:牛客网 取石子时间限制:C/C++ 1秒,其他语言2秒空间限制:C/C++ 262144K,其他语言5 ...
- SQL Server 并发死锁解决案例备忘
SET @sql = ' SET TRANSACTION ISOLATION LEVEL REPEATABLE READ; SET DEADLOCK_PRIORITY 10 BEGIN TRAN DE ...
- MySQL--字符集基础
========================================================================= 字符集和编码规则 字符集:特定类型或用途的字符集合, ...