on() 和 click() 的区别
2024-08-24 03:44:20
on() 和 click() 的区别:
二者在绑定静态控件时没有区别,但是如果面对动态产生的控件,只有 on() 能成功的绑定到动态控件中。
以下实例中原先的 HTML 元素点击其身后的 Delete 按钮就会被删除。而动态添加的 HTML 元素,使用 click() 这种写法,点击 Delete 按钮无法删除;使用 On() 方式可以。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://cdn.bootcss.com/jquery/2.2.4/jquery.min.js"></script>
<script>
$("#newclick").click(function(){
$(".li").append('<li>动态添加的HTML元素click<button class="deleteclick">Delete</button></li>');
});
$("#newon").click(function(){
$(".li").append('<li>动态添加的HTML元素on<button class="deleteon">Delete</button></li>');
});
$(".delete").click(function(){
$(this).parent().remove();
}); $(".li").on('click', ".deleteon", function(){
$(this).parent().remove();
})
$(".deleteclick").click(function(){
$(this).parent().remove();
});
</script>
</head>
<body>
<h1>展示jQuery中on()和click()的区别</h1> <p>
<span>点击生成新按钮。NewOn生成的Delete按钮行为用on()实现,NewClick生成的Delete按钮行为用click()实现。</span>
</p>
<div class="test">
<button class="new" id="newon">NewOn</button>
<button class="new" id="newclick">NewClick</button>
<ul class="li">
<li>原先的HTML元素on<button class="deleteon">Delete</button></li>
<li>原先的HTML元素click<button class="deleteclick">Delete</button></li>
</ul>
</div>
</body>
</html>
最新文章
- 《饥荒游戏》SW BUG 刷猴子 &; 刷淘气值 办法
- 错误:创建 cachingConfiguration 的配置节处理程序时出错: 未能加载文件或程序集“Microsoft.Practices.EnterpriseLibrary.Caching,
- 转收藏:Git常用命令速查表
- linux命令之-pstree使用说明
- Haskell 几乎无疼痛入门指南
- Docker镜像加速
- Python对于CSV文件的读取与写入
- phpExcel导出excel加超级链接的实例代码[转]
- linux 的基础命令
- python垃圾回收机制:引用计数 VS js垃圾回收机制:标记清除
- nodejs-日志组件log4js的使用方法
- Coablt strike官方教程中文译版本
- HDU 4638 Group(莫队)题解
- 2015.7.10js-07(简单时间)
- 【css】table标签内的td、th如何设置固定宽度,而不是自适应?
- Java工具类-验证码工具
- java的poi导入excel时解析日期
- IdeaVim插件使用技巧--JetBrains Plugin Vim
- laravel count的使用
- web.xml中classpath表示什么样的路径
热门文章
- jzoj6003. 【THUWC2019模拟2019.1.16】Square (乱搞)
- [Xcode 实际操作]六、媒体与动画-(14)使用SystemSoundId播放简短声音
- 程序员收藏必看系列:深度解析MySOL优化(一)
- for循环,递归,函数封装作业
- JDK动态代理 Proxy InvocationHandler
- ES6入门教程---数值扩展和数组扩展
- Codeforces Round #527 -A. Uniform String(思维)
- HttpServletRequest 和 HttpServletResponse
- Java带token验证的注册登录
- mysql 存储过程变量及循环的使用