$("#XXX").click()和$("#YYY").on("click","指定的元素",function(){});的区别(jQuery动态绑定事件)

简介:       //绑定 下一页 的点击事件 $("a[aria-label='Next']").click(function(){ $("a[aria-label='Previous']").
      //绑定 下一页 的点击事件  
         $("a[aria-label='Next']").click(function(){  
             $("a[aria-label='Previous']").show();  
             if(page.pageNo == page.totalPage - 1){  
                 $("a[aria-label='Next']").hide();  
             }else{  
                 $("a[aria-label='Next']").show();  
             }  
             page.pageNo++;  
             page.pageSet(bindData , page);  
         });  
           
         //上面的.click()绑定点击事件 和 下面的 $(document).on("click",".pagination li:gt(0):not(:last)",function(){});的区别在于:  
         //.click只能为页面现有的元素绑定点击事件,如果是动态生成的新的元素,是没有事件的  
       //而$(document).on("click","指定的元素",function(){});方法则是将指定的事件绑定在document上,
//而新产生的元素如果符合指定的元素,

//那就触发此事件
//为动态生成的 页码按钮 添加 点击事件 $(document).on("click",".pagination li:gt(0):not(:last)",function(){ page.pageNo = $(this).text(); $("a[aria-label='Previous']").show(); $("a[aria-label='Next']").show(); if(page.pageNo == "1"){ $("a[aria-label='Previous']").hide(); } if(page.pageNo == page.totalPage){ $("a[aria-label='Next']").hide(); } page.pageSet(bindData , page); });

 

 

结论:

上面的.click()绑定点击事件 和 下面的 $(document).on("click",".pagination li:gt(0):not(:last)",function(){});的区别在于:
1》》.click只能为页面现有的元素绑定点击事件,如果是动态生成的新的元素,是没有事件的
2》》而$(document).on("click","指定的元素",function(){});方法则是将指定的事件绑定在document上,而新产生的元素如果符合指定的元素,那就触发此事件

 

相关文章
|
8月前
|
Python
[oeasy]python086方法_method_函数_function_区别
本文详细解析了Python中方法(method)与函数(function)的区别。通过回顾列表操作如`append`,以及随机模块的使用,介绍了方法作为类的成员需要通过实例调用的特点。对比内建函数如`print`和`input`,它们无需对象即可直接调用。总结指出方法需基于对象调用且包含`self`参数,而函数独立存在无需`self`。最后提供了学习资源链接,方便进一步探索。
216 17
|
JavaScript 前端开发
jQuery 事件
jQuery 事件
120 1
|
JavaScript
箭头函数与普通函数(function)的区别
箭头函数是ES6引入的新特性,与传统函数相比,它有更简洁的语法,且没有自己的this、arguments、super或new.target绑定,而是继承自外层作用域。箭头函数不适用于构造函数,不能使用new关键字调用。
|
JavaScript
jQuery 事件
jQuery 事件
102 10
|
JavaScript 前端开发 CDN
jQuery学习记录--jQuery语法,选择器,事件及hide(),show(), toggle()
本文是关于jQuery的学习笔记,涵盖了jQuery的简介、语法、选择器、事件处理以及hide()、show()、toggle()等方法的使用。
jQuery学习记录--jQuery语法,选择器,事件及hide(),show(), toggle()
|
JavaScript
jQuery 事件 方法
jQuery 事件 方法
81 3
|
JavaScript
箭头函数与普通函数(function)的区别
箭头函数是ES6引入的新语法,相比传统函数表达式更简洁,且没有自己的this、arguments、super或new.target绑定,而是继承自外层作用域。这使得箭头函数在处理回调和闭包时更加灵活方便。
|
JavaScript 前端开发 API
深入理解jQuery:高效DOM操作与事件处理
【10月更文挑战第11天】深入理解jQuery:高效DOM操作与事件处理
179 0
|
Web App开发 JavaScript Android开发
重载jquery on方法实现click事件在移动端的快速响应
重载jquery on方法实现click事件在移动端的快速响应
|
JavaScript
jQuery 事件 方法
jQuery 事件 方法
95 0

相关课程

更多