Dav*_*ile 6 javascript browserify
我可以使browserify工作但是对于如何从DOM访问bundle.js中的函数感到有些困惑.
我有三个档案 -
message.js
module.exports = function (){
return "Hello";
};
Run Code Online (Sandbox Code Playgroud)
main.js
var getMessage = require('./message');
//This shows the alert when script loads
alert(getMessage());
//cannot find this function from index.html
function fnClick(){
alert(getMessage());
}
Run Code Online (Sandbox Code Playgroud)
的index.html
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="js/bundle.js"></script>
</head>
<body>
<button onclick="fnClick();">Click</button>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
在浏览器中,当alert(getMessage());main.js中的脚本加载显示警报但调试器时,fnClick未定义,我可以使用范围.
谢谢
Fre*_*dyC 20
条目文件中的任何代码都在闭包中执行.如果你看一下创建的bundle.js,你会在那里看到类似的东西.
function(require, module, exports) {
function fnClick() {
alert(getMessage());
}
}
Run Code Online (Sandbox Code Playgroud)
您在此处创建的任何内容都将仅隐藏到全局空间,除非您明确使用window对象(但不要这样做)来公开它.
正如@elclanrs在上面的评论中所说的那样,只需在代码中添加侦听器而不是HTML.如果您不想使用外部库,则可以采用这种方式.
var button = document.getElementById('my-button'); // add id="my-button" into html
button.addEventListener('click', fnClick);
Run Code Online (Sandbox Code Playgroud)
或者像流行的jQuery这样的库你只需要调用.
$('#my-button').click(fnClick)
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
6270 次 |
| 最近记录: |