大牛都来看一下 JavaScript 事件处理

2015-04-25 17:25:35 +08:00
 whatisnew

一个链接指向文件本身:

<!-- 文件 index.html -->
<a href="index.html" class="clickme">index.html</a>

点击这个链接时,console 一下 clicked

$(document).on('click', 'a.clickme', function() {
  console.log('clicked');
});

但是问题是,
点1次 console一次,点2次 console 2次,点3次 console 3次,点4次。。。
这是什么情况。。。 用了 requirejs

3081 次点击
所在节点    JavaScript
12 条回复
MinonHeart
2015-04-25 17:33:06 +08:00
点几次就出几次,这有什么问题?
rming
2015-04-25 17:33:38 +08:00
难道有什么不对的地方么
whatisnew
2015-04-25 17:38:43 +08:00
@rming
@MinonHeart

他是在原有的 console 的基础上 log 出来 n 次。

比如,点3次,那么就是 log 出来 1+2+3 次
ALeo
2015-04-25 17:42:26 +08:00
那就要看看你的html中是不是只有一个`a.clickme`的标签了。。
whatisnew
2015-04-25 17:45:31 +08:00
jQuery 有一个 unbind() 可以解决这个问题,但是我很好奇他是为什么发生的
mikumikumoe
2015-04-25 17:48:42 +08:00
点了链接后代码又被加载了一次?
whatisnew
2015-04-25 17:50:03 +08:00
event.stopImmediatePropagation(); 也可以解决这个问题

但是这个问题怎么发生的?一般来说不需要 unbind 或者 stopImmediatePropagation 的
whatisnew
2015-04-25 17:54:58 +08:00
是不是因为我用 requirejs 加载的时候,每一次 requirejs 都 new 一个事件,然后,以前的事件没有注销,所以会出现这样的情况呢?
xavierchow
2015-04-25 20:15:59 +08:00
你贴的两段代码提供不了全部信息,如我示例https://gist.github.com/xavierchow/157c05b7fea5f28854b4
不会出现你的问题。
感觉你的事件handler重复注册了,我有两个问题:
1. a标签指向自己,点了后页面有跳转吗?是否还有别的处理?如果整页刷新的话新的DOM新的Handler应该不会出现你的问题。
2. 我猜测是你的页面没有刷新,但是这段注册事件的脚本反复被执行了,在`$(document).on`的外面加console.log检查注册了几次?
solupro
2015-04-25 20:29:28 +08:00
代码贴得不全,按你说法估计是事件被重复绑定了
NeoAtlantis
2015-04-25 20:45:20 +08:00
我想问题还是出在他那个链接指向的是页面本身。。。这样点了之后也许因为什么原因事件就又绑定了一次。。。
whatisnew
2015-04-26 05:55:18 +08:00
@xavierchow
@NeoAtlantis
@solupro

多谢各位大神的回复,问题已解决。
睡了一觉起来,精神好很多。然后发现我是在一个 requirejs 加载进来的对象内,调用对象本身的一个方法,去绑定一个实时事件,所以,会产生多重绑定,事件绑定放在绑定对象外就可以了。
哈哈。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/186270

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX