近期从同事手里接过来的项目,是用JQUERY来做的,以达到页面不刷新的效果.后来,发现前面做的有些页面还是没达到预期效果.特别是一些组件都没有抽取出来,于是,就开始抽取公用组件.
其中有一个分页组件,因为在点击分页按钮时,需要触发不同的请求事件,于是,就传入具体的事件:
myself.preBtn.click(function(){ myself.configs.curPageNum = 1; }); myself.preBtn.click(callback); myself.preBtn.click(function(){ myself.configs.curPageNum = 1; myself.pageTxt.val(myself.configs.curPageNum); $(this).attr('disabled',true); myself.nextBtn.attr('disabled',false); myself.endBtn.attr('disabled',false); });
这种方式在火狐上是没问题的,火狐浏览器按顺序逐个触发.但在IE上却是先触发myself.preBtn.click(callback);这样就导致分页出现问题.最后修改为:
myself.preBtn.click(function(){ myself.configs.curPageNum = 1; if(callback) callback(); myself.pageTxt.val(myself.configs.curPageNum); $(this).attr('disabled',true); myself.nextBtn.attr('disabled',false); myself.endBtn.attr('disabled',false); });
相关推荐
在代码示例中,我们可以通过jQuery绑定click事件到指定的DOM元素,例如id为"article"的div元素。在事件处理函数中,我们可以调用event.stopPropagation()方法来阻止事件冒泡,这有助于防止事件在DOM树上向上冒泡而...
1. 事件绑定:在jQuery中,绑定事件是通过选择器选中DOM元素后,使用.on()方法来绑定一个或多个事件处理器。推荐使用.on()而不是旧的语法糖方法,如click()等,因为.on()提供了更好的灵活性和兼容性。.on()方法可以...
在JavaScript中,创建一个input数组并绑定click事件是常见的需求,尤其在动态生成或操作DOM元素时。这个过程包括获取页面上的input元素,将它们组织成数组,然后为每个元素添加点击事件监听器。以下是对这个主题的...
- **事件绑定**:jQuery提供了一系列方法来绑定事件,例如`click()`、`mouseover()`等。 - **`click()`**:当用户点击元素时触发。 - **`mouseover()`和`mouseout()`**:分别在鼠标进入和离开元素时触发。 - **`...
`on()`方法的灵活性体现在它可以接收多个参数,如`childSelector`和`data`,使得我们可以对事件处理程序进行更复杂的设置,如事件委托和传递额外数据。例如,`$("div").on('click', ".btn1",{num:123}, function(e){...
相比直接通过`onclick`属性设置,jQuery的`.on()`方法允许同时绑定多个事件处理函数,并支持事件委托,即在一个父元素上监听事件,根据事件源来决定执行哪个子元素的处理函数。 事件委托在处理动态添加的元素时尤其...
使用`$('element').on('click', function (argument) {})`则是jQuery推荐的事件绑定方式。它不仅支持绑定多种类型的事件,还能添加多个事件处理器。这种方法通过`on`方法的事件名称参数来指定要监听的事件类型,...
如果多次绑定,将会覆盖前面的绑定。比如: ```javascript elem.click = function() { // 事件处理代码 }; ``` 在jQuery中,我们同样可以使用类似的语法,如`$("#chua").click(fn);`。但是,jQuery中的实现是通过...
1. **性能考虑**:频繁地绑定和解除绑定可能会对性能造成一定影响,尤其是在高性能要求的应用场景中。 2. **可维护性**:通过这种方式管理事件处理程序会使得代码变得较为复杂,特别是在大型项目中。考虑使用更高级...
"jquery多页签tab翻滚切换"就是一个专注于改善页面导航功能的实践案例。jQuery库以其简洁API和强大的功能,成为了JavaScript开发者的首选工具之一,尤其是在实现动态交互效果时。在这个项目中,开发者巧妙地利用了...
9. **浏览器兼容性**:虽然jQuery已经处理了很多跨浏览器的问题,但在实际应用中仍需关注对旧版浏览器的支持,确保所有核心功能在所有目标浏览器中都能正常工作。 10. **测试与调试**:开发过程中,需要进行充分的...
`on()`方法可以一次绑定多个事件,甚至可以对未创建的元素进行事件绑定,提高了代码的灵活性。 ```javascript $(document).on('click', '#myElement', function() { // 事件处理代码 }); ``` ### 三、动画与效果 ...
- **jquery-1.7.2.min.js**:这个版本进一步优化了DOM操作和事件处理,引入了`.on()`方法,可以一次性绑定多个事件,并支持事件委托。此外,它增强了动画效果的性能,并对API进行了一些调整,使其更符合当前的开发...
9. **兼容性**: jQuery致力于浏览器兼容性,使得开发者可以编写一次代码,应用于多种浏览器,降低了跨平台开发的难度。 10. **性能优化**: 使用`$(document).ready()`确保DOM加载完成后执行脚本,减少DOM操作以提高...
使用`.on()`方法,你可以一次性绑定多个事件,如`$("#element").on("click mouseover", function() {...})`。此外,还有`.click()`, `.mouseover()`, `.mouseout()`等便捷的方法。 4. **动画效果**:jQuery的`....
`.triggerHandler()` 方法类似 `.trigger()`,但只触发绑定的事件处理程序,不会执行浏览器默认的行为。 ```javascript $("input").triggerHandler("focus"); // 只触发绑定的焦点事件处理程序 ``` 对于需要解除...
同时,`on()`方法可以用于一次性绑定多个事件,提高了代码的可维护性。 4. **动画效果(Animation)** jQuery的`animate()`函数允许开发者创建自定义的动画效果,通过指定CSS属性的变化来实现平滑过渡。另外,`....
3. **jQuery绑定事件**:利用jQuery的`click`事件监听tab标签,当用户点击某个tab时,触发相应的回调函数。 4. **切换逻辑**:在回调函数中,根据点击的tab,改变图片的显示状态,比如通过`fadeIn`和`fadeOut`实现...
从1.5版本到3.21版本,JQuery经历了多次迭代,每次更新都旨在提高性能、增强功能并修复已知问题。在本压缩包中,你将找到这些不同版本的JQuery jar包,这对于开发者来说是宝贵的资源,可以方便地在项目中选择适合的...
3. **事件处理**:使用jQuery,绑定事件变得简单,如`click()`、`change()`等。同时,`event.preventDefault()`和`event.stopPropagation()`提供了更灵活的事件控制。 4. **动画效果**:jQuery 的`fadeIn()`, `...