最近一直被一个问题困扰着 就是在某些地方jquery绑定的事件会重复执行,例如我绑定了一个click事件,但当我点击的时候会执行两到三次甚至更多,一直没有想到解决的办法。
今天又遇到了同样的问题:一个点击事件,使一个元素在显示不显示两种状态切换,当整个页面不变,而元素所在的这块重新被加载之后(这是另一个jsp,用load方法加载的),点击切换的效果没了,当再次刷新这一部分,切换效果又出现了。
初时以为没有切换是因为事件没执行,然而在使用alert检验事件是否执行时发现,其实是因为事件重复执行了两次,也就是隐藏状态切换成显示又切换回隐藏,或显示状态切换至隐藏又切换至显示,所有表面看起来像是没有执行。经过思考之后,得出了一个结论,就是 在部分刷新之后,jquery(或者说浏览器)会认为重新加载的元素跟之前的元素(已经被覆盖了)是同一个,而之前绑定过一次,刷新之后又绑定一次,所以是同一事件在同一元素上绑定两次,也就会执行两次,再局刷,再绑定一次。
有了这个结论,于是想到之前的事件绑定是在父页面的js里,现在放到了子页面引用的js里,于是,原来是使用live方法动态绑定事件的,现在直接改成click,于是问题得以解决。