首页
学习
活动
专区
圈层
工具
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

事件绑定的几种常见方式

在项目开发中,经常遇到绑定事件不起作用,或者事件绑定多次,导致重复触发。...1.事件绑定的几种常见方式(以click事件为例) jquery: $(selector).click(function(){...})...bind方法   会给每一个符合selector的元素添加click执行函数,即:将click事件绑定到所有设置了的selector元素上,如果动态添加了元素,之前绑定事件也起作用 live方法   ...[注意:live事件,jQuery 1.7以后版本使用on代替live,且移动设备safari浏览器不支持live事件] 【穿插解决方案: 移动设备safari浏览器不支持live事件 方法一: 首先要给绑定....); }   在大量使用ajax时,为了触发事件会在success里调用clickEvent方法,然后由于其他地方需要触发同样的事件又会调用clickEvent,这样很容易导致多次触发。

1.8K80
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    jQuery最佳实践

    jQuery测试,看看浏览器在1秒内能够执行多少次。...可以看到,1.6.2版本的运行次数,远远超过两个老版本。尤其是第一条语句,性能有数倍的提高。 其他语句的测试,比如.attr(“value”)和.val(),也是新版本的jQuery表现好于老版本。...Firefox、Safari、Chrome、Opera浏览器,都有原生方法getElementByClassName(),所以速度并不慢。...比如,有一个表格(table元素),里面有100个格子(td元素),现在要求在每个格子上面绑定一个点击事件(click),请问是否需要将下面的命令执行100次?   ...选择作用域链最短的方法 严格地说,这一条原则对所有Javascript编程都适用,而不仅仅针对jQuery。 我们知道,Javascript的变量采用链式作用域。

    85330

    jQuery最佳实践

    三个版本的jQuery测试,看看浏览器在1秒内能够执行多少次。...可以看到,1.6.2版本的运行次数,远远超过两个老版本。尤其是第一条语句,性能有数倍的提高。 其他语句的测试,比如.attr("value")和.val(),也是新版本的jQuery表现好于老版本。...Firefox、Safari、Chrome、Opera浏览器,都有原生方法getElementByClassName(),所以速度并不慢。...比如,有一个表格(table元素),里面有100个格子(td元素),现在要求在每个格子上面绑定一个点击事件(click),请问是否需要将下面的命令执行100次?   ...选择作用域链最短的方法 严格地说,这一条原则对所有Javascript编程都适用,而不仅仅针对jQuery。 我们知道,Javascript的变量采用链式作用域。

    1.7K60

    前端关键技术点杂烩,这些你必须知道

    ,声明函数在全局作用域,此时作用域链只有一个环境对象;运行函数时作用域链顶端加入了函数内的环境对象,运行完毕时顶端环境对象被销毁,以此类推。...全局变量总是存在于运行期上下文作用域链的最末端,因此在标识符解析的时候,查找全局变量是最慢的。 (最好和闭包一起理解) 21、你对前端有什么理解?...34、移动设备浏览器的 click 事件 300毫秒延迟 来源于最初的 iOS Safari 浏览器在用户点击屏幕时会等待 300 毫秒,以判断用户是想进行单击还是进行双击缩放。...其他浏览器也借鉴 Safari 的特性,导致了这一问题。...touchend 事件的时候,会通过 DOM 自定义事件立即出发模拟一个 click 事件,并把浏览器在300ms之后的 click 事件阻止掉。

    1.6K20

    前端开发,关键技术点杂烩

    ,声明函数在全局作用域,此时作用域链只有一个环境对象;运行函数时作用域链顶端加入了函数内的环境对象,运行完毕时顶端环境对象被销毁,以此类推。...全局变量总是存在于运行期上下文作用域链的最末端,因此在标识符解析的时候,查找全局变量是最慢的。 (最好和闭包一起理解) 21、你对前端有什么理解?...34、移动设备浏览器的 click 事件 300毫秒延迟 来源于最初的 iOS Safari 浏览器在用户点击屏幕时会等待 300 毫秒,以判断用户是想进行单击还是进行双击缩放。...其他浏览器也借鉴 Safari 的特性,导致了这一问题。...touchend 事件的时候,会通过 DOM 自定义事件立即出发模拟一个 click 事件,并把浏览器在300ms之后的 click 事件阻止掉。

    1.1K30

    求职 | 史上最全的web前端面试题汇总及答案

    (W3C CSS 2.1 规范中的一个概念,它决定了元素如何对其内容进行定位,以及与其他元素的关系和相互作用。) 描述CSS Reset的作用和用途。...以button的Click事件为例: 1、直接在元素上绑定回调函数 click me 2、JS获取DOM元素对象后...jQuery是一个js库,主要提供的功能是选择器,属性修改和事件绑定等等。 jQuery UI则是在jQuery的基础上,利用jQuery的扩展性,设计的插件。...如何判断当前脚本运行在浏览器还是node环境中?(阿里) 通过判断Global对象是否为window,如果不为window,当前脚本没有运行在浏览器中。...jQuery兼容各种主流浏览器,如IE 6.0+、FF 1.5+、Safari 2.0+,Opera 9.0+等。

    1.4K10

    前端开发面试题答案(四)

    *jQuery UI则是在jQuery的基础上,利用jQuery的扩展性,设计的插件。...'browser' : 'node'; 通过判断Global对象是否为window,如果不为window,当前脚本没有运行在浏览器中 41、jQuery 的 slideUp动画 ,如果目标元素是被外部事件驱动...内存泄漏指任何对象在您不再拥有或需要它之后仍然存在。 垃圾回收器定期扫描对象,并计算引用了每个对象的其他对象的数量。...知道怎么用浏览器的各种工具来调试和debug代码么? Chrome,Safari浏览器内核。 45、用js实现千位分隔符?...polyfill 是“在旧版浏览器上复制标准 API 的 JavaScript 补充”,可以动态地加载JavaScript 代码或库,在不支持这些标准 API 的浏览器中模拟它们。

    2.2K20

    前端开发中不可忽视的知识点汇总(二)

    闭包是指有权访问另一个函数作用域中变量的函数,创建闭包的最常见的方式就是在一个函数内创建另一个函数,通过另一个函数访问这个函数的局部变量,利用闭包可以突破作用链域,将函数内部的变量和方法传递到外部。...polyfill 是“在旧版浏览器上复制标准 API 的 JavaScript 补充”,可以动态地加载 JavaScript 代码或库,在不支持这些标准 API 的浏览器中模拟它们。...列举IE与其他浏览器不一样的特性 事件不同之处: 触发事件的元素被认为是目标(target)。...*(优点)因为Node是基于事件驱动和无阻塞的,所以非常适合处理并发请求, 因此构建在Node上的代理服务器相比其他技术实现(如Ruby)的服务器表现要好得多。...向前端优化指的是,在不影响功能和体验的情况下,能在浏览器执行的不要在服务端执行,能在缓存服务器上直接返回的不要到应用服务器,程序能直接取得的结果不要到外部取得,本机内能取得的数据不要到远程取,内存能取到的不要到磁盘取

    1.7K40

    17款好用的跨浏览器测试神器,兼容性测试必备!

    2Browser Sandbox Browser Sandbox是一款可运行在桌面和平板上的应用程序,可以像运行原生浏览器那样运行多种浏览器。...BrowserStack 列出了数百种浏览器、设备和测试策略,确保你的网站可以在尽可能多的环境中正常运行。...9SauceLabs TestingBot为网站和原生移动 App 提供了完整的测试策略,可以在真实的 iOS 或 Android 设备上运行测试。...因为它是基于 W3C WebDriver 和 Chrome DevTools 的,所以可以在本地运行,也可以在云端运行,就像 SauceLab、BrowserStack 和 TestingBot 那样。...17 Selenium Selenium是一款浏览器自动化测试工具,相信测试伙伴们都对它很熟悉。实际上,它并没有提供现成的测试框架,但可以通过扩展来实现。

    2.3K30

    JS魔法堂:元素克隆、剪切技术研究

    2、document.importNode                        浏览器支持:IE9+和其他现代浏览器均支持。 作用:拷贝其他文档中的元素到当前文档中。...虽然规范中描述其作用为拷贝其他文档中的元素,但实际上是可以对当前文档的元素进行拷贝的;     4. ...作用:剪切其他文档中的元素到当前文档中。...虽然规范中描述其作用为拷贝其他文档中的元素,但实际上是可以对当前文档的元素进行拷贝的;     3. ...el替换为otherEl并将el作为函数返回值, 此时el已经脱离了DOM树; el.swapNode(HTMLElement} otherEl) 作用是交换el和otherEl在树层级结构中的位置,两者均在

    1.2K50
    领券