手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >使用jQuery避免鼠标双击的解决方案
使用jQuery避免鼠标双击的解决方案
摘要:介绍当用户双击DOM对象(例如按钮和链接等)时,对于用户交互一直是个麻烦的问题。幸运的是,jQuery提供了一个相当棒的解决方法。那就是.o...

介绍

当用户双击DOM对象(例如按钮和链接等)时,对于用户交互一直是个麻烦的问题。 幸运的是, jQuery 提供了一个相当棒的解决方法。 那就是.one()。

.one()这个方法是做什么的?

它附加了一个元素事件的处理程序并且每个元素只能运行一次事件处理器函数。

参数

.one( events [, selector ] [, data ], handler(eventObject) )

events

类型: String

•规定添加到元素的一个或多个事件。由空格分隔多个事件。必须是有效的事件。就像“click”和“keydown.myPlugin”一样。

选择器参数

参数类型: String

•选择器字符串用于过滤出被选中的元素中能触发事件的子元素

•如果传null或者省略,当事件到达选定的元素时就会被触发

数据

参数类型: 任何类型

•该参数的值在事件触发将会传递给的事件处理函数

事件处理函数

参数类型:函数类型

•事件触发时应该调用的函数

•false 也是允许的因为它就是简单return false;函数的简写形式

举例

复制代码 代码如下:

$("#saveBttn").one("click", function () {

alert("This will be displayed only once.");

});

或者

复制代码 代码如下:

$("body").one("click", "#saveBttn", function () {

alert("This displays if #saveBttn is the first thing clicked in the body.");

});上述代码关键在于:

•当代码执行结束时,点击id为saveBtn的元素将会弹出警告框

•之后的点击将没有任何反映

•这等同于 ==>

复制代码 代码如下:

$("#saveBttn").on("click", function (event) {

alert("This will be displayed only once.");

$(this).off(event);

});

换句话说这和在绑定事件处理函数中显式调用off()作用是一样的

了解更多请点击

jQuery .one()

总结

上面所提到的方法是jQuery 1.7的新特性,所以如果你的元素点击事件不止触发一次,这可能是个解决方案哦。多么神奇的方法啊,如有任何疑问请联系我。

【使用jQuery避免鼠标双击的解决方案】相关文章:

jquery实现图片左右切换的方法

jQuery基于图层模仿五星星评价功能的方法

JQuery自动触发事件的方法

根据内容自动调整弹出窗口大小的JS解决方案

js判断鼠标位置是否在某个div中的方法

jQuery实现不断闪烁文字的方法

AspNet中使用JQuery boxy插件的确认框

jQuery判断一个元素是否可见的方法

浅谈jQuery构造函数分析

体验jQuery和AngularJS的不同点及AngularJS的迷人之处

精品推荐
分类导航