jQuery事件重复绑定解决

原代码如下:

2016-08-30_17-16-02

“bindBusyEvent”为弹出层打开后绑定事件,会重复调用,主观认为只会绑定一次,实际是累加,无图无真相,上图:

2016-08-30_17-16-57

如图所示,事件绑定累加,会导致重复执行。解决方法如下:

2016-08-30_17-23-38

事件换成通过“on”绑定,执行完毕通过“off”移除掉绑定,“off”为jQuery1.7.2新增的方法

补充

有童鞋说可以通过“unbind”解决这个问题,网上也有很多资料都是通过“unbind”解决的,确实可以,只是“unbind”在jQuery3.0中就被遗弃了,为了向后看,所以还是通过off搞定。

用“off”的另外的一种写法:.off(‘click’).on(‘click’…

jQuery还支持“one”绑定事件,只执行一次

总结

本文其实是在讲通过“on”绑定的事件可以通过“off”移除

本文场景中的例子,终极解决办法应该是把绑定写到外面,不重复执行绑定。。。

 

jquery 统计输入字符数

做了一发送短信功能,需要用到字符数统计,查询Google良久,都有问题,剪切、粘贴进来的无法及时统计或者右键操作了也无法及时统计,自己测试了好一会,终于解决,代码如下:

2016-07-23_15-36-15

注解:

统计字数的难点在于,直接快捷键粘贴、剪切无法及时统计,右键操作无法及时统计

IE下的粘贴事件用paste,Firefox下的粘贴事件用input

IE下的change事件用propertychange,Firefox下的change事件就用change

经群里某童鞋提醒,监听事件可以简化下,修正版代码如下:

2016-07-23_15-38-08

js或jQuery无法提交表单问题(formObj.submit()无响应)

问题背景

HTML代码如下:

2015-04-23_12-16-41.png

js代码如下:

2015-04-23_12-18-09.png

 意图通过js提交表单,却发现表单实际根本没有提交,IE下提示“Uncaught TypeError: Property ‘submit’ of object # is not a function”。

原因分析

页面中有表单元素”name=’submit'”,$(‘#testForm’).submit();被执行的时候,会定位到该元素,然后导致实际无法提交表单。

问题解决

 将表单中name=”submit”或者id=”submit改成name=“****”、id=”****”,****处注意不要和表单事件名称、表单默认属性名称相同

在线Demo:http://jsfiddle.net/4xk2kqpo/