使用 RequireJS 做模块化编程时遇到的一些关于全局变量的问题

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

V2EX 提问指南

这是一个创建于 3446 天前的主题，其中的信息可能已经有所发展或是发生改变。

请问大家用RequireJS做模块化编程的时候，对下面这种点击事件绑定的函数是怎么处理的？

我目前想到的办法是主动在模块内暴露一个对象到全局变量中，像这样:

但是感觉这种办法不太好，会污染全局变量而且有些违背RequireJS的初衷，但不知道怎么做更好。

求教~

第 1 条附言 · 2015-06-08 17:33:39 +08:00

问题已经解决，谢谢大家~

requireJS

变量

全局

14 条回复 • 2015-06-08 18:32:32 +08:00

7anshuai

2015-06-08 16:18:25 +08:00

尽量不使用 HTML 元素的事件处理程序属性

DIYgod

2015-06-08 16:21:40 +08:00

@7anshuai 我试过用JS来绑定点击事件函数也无法识别到，点击时无法执行那个函数

loethen

2015-06-08 16:32:55 +08:00

@DIYgod 不知道你是如何用js绑定的，为什么无法执行。
贴代码看看呢

7anshuai

2015-06-08 16:37:22 +08:00

@DIYgod 如果 h2#type-all 是动态插入的DOM，在绑定事件函数时，你可以通过事件冒泡绑定到页面已存在的元素，比如 div.type

DIYgod

2015-06-08 16:44:56 +08:00

@loethen 当时的代码已经找不到了，我简单写了个示范，就是像下面这样：

define(function() {
var h3 = document.getElementsByTagName('h3')[0];
h3.addEventListener('click', typeClick(h3));

function typeClick(ele) { }
});

这样的话在当前模块里可以执行h3.click()，但是在实际页面中点击h3元素并不能执行typeClick函数。

DIYgod

2015-06-08 16:46:52 +08:00

@7anshuai 可是问题在无法无法绑定到那个函数而不是获取不到DOM，因为函数是在模块内的，不是全局函数

7anshuai

2015-06-08 17:03:20 +08:00

h3.addEventListener('click', typeClick(h3)); 绑定的方式有错误啊，应该是 h3.addEventListener('click', typeClick);

loethen

2015-06-08 17:05:15 +08:00

@DIYgod 没看出代码有什么问题，是不是这个模块根本就没有执行？你如何确定已经获取dom了？

DIYgod

2015-06-08 17:09:52 +08:00

@7anshuai
@loethen
可是在当前模块里执行h3.click()可以执行到typeClick啊，但是在页面中点击元素就无法执行到typeClick函数，我猜测是typeClick函数不是全局函数的原因。
非常感谢，稍等我写个Demo就清楚了~

emric

2015-06-08 17:27:46 +08:00

xy问题

DIYgod

2015-06-08 17:32:44 +08:00

@loethen
解决了。。。我刚刚又试了一下正是@7anshuai 说的问题，绑定的方式有错误，低级错误不好意思。。
在JS里绑定点击事件就行了。

7anshuai

2015-06-08 18:11:59 +08:00

@DIYgod 那为啥原来的代码中 h3.click()，可以触发事件函数 typeClick ?

DIYgod

2015-06-08 18:19:49 +08:00

@7anshuai 在执行这一句（
h3.addEventListener('click', typeClick(h3)); ）的时候间接触发了typeClick(h3)，使我误以为正常执行了h3.click()

哈哈，真是不好意思~

7anshuai

2015-06-08 18:32:32 +08:00

@DIYgod 哈哈，原来如此