在单页面应用中使用jquery的Requirejs
在单页面应用中使用jquery的Requirejs
提问于 2013-12-03 09:22:33
我正在学习RequireJS，在这个过程中我遇到了以下问题：
我正在尝试实现一个单一页面应用程序。下面所考虑的场景与实际问题相似。
Index.html
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>Test</title>
<script src="require.js" data-main="main.js"></script>
</head>
<body>
<button id="start">Start</button>
<div id="buttonContainer"></div>
</body>
</html>main.js
require([ 'jquery' ], function( $) {
$(function() {
$("#start").click(function() {
$("#buttonContainer").load("page1.html");
require(['module1'],function(){});
});
});
});页面1.html
<div>
<button id="button_1">Click Me!!</button>
</div>module1.js
define(['jquery'],function($){
$(function(){
$("#button_1").click(function(){
$("#buttonContainer").load("page2.html");
require(['module2'],function(){});
});
});
});page2.html
<div>
<button id="button_2">Back</button>
</div>模2.js
define(['jquery'],function($){
$(function(){
$("#button_2").click(function(){
$("#buttonContainer").load("page1.html");
require(['module1'],function(){});
});
});
});单击start in index.html，div中填充！，单击单击me!!，div中填充BackE 227按钮，单击E 128BackE 229按钮再次E 130单击me！！E 231被填充，反之亦然。
在html的jquery上，我调用..to()为html调用各自的js函数。我的方法正确吗？？
回答 1
Stack Overflow用户
发布于 2013-12-03 10:20:34
你的做法是错误的。如果要求module1和module2在每次您的代码需要模块时执行模块工厂，您的代码就可以工作。但是，按照RequireJS的工作方式，只在第一次需要模块时才执行模块的工厂。(“工厂”是定义模块时传递给define的回调。)
我不清楚有什么理由像问题中那样将代码划分为模块。这似乎没有必要。
如果有理由按照问题中的方式将模块划分成模块，那么只有在调用函数时，我才会让模块在页面上工作。那么module1.js可能是这样的：
define(['jquery', 'module2'], function ($, module2) {
return function () {
// Whatever actions I want...
};
});module2的结构类似于module1。main.js应该是这样的：
require(['jquery', 'module1'], function ($, module1) {
$(function () {
[...]
// This calls the function you returned when defining module 1.
module1();
[...]
});
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/20347194
复制相关文章
相似问题
腾讯云开发者
