下面就为大家分享一篇基于 jQuery 的 on 和 click 的区别详解, 具有很好的参考价值, 希望对大家有所帮助.
● click() 属于静态加载, 当页面加载完, 就不再为新增加的元素添加点击事件.
● on() 属于动态加载, 当页面加载完, 可以为新增加的元素添加事件. 但是必须选定父级元素.
(推荐: jQuery 极速入门 https://www.html.cn/study/28.html )
使用示例:
- $("#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();
- });
注: on 前面的元素必须在页面加载的时候就存在 DOM 里面.
本文来自 jQuery 答疑 https://www.html.cn/qa/jquery/ 栏目, 欢迎学习!
来源: http://www.css88.com/qa/jquery/15373.html