如何在html中通过RequireJS调用已定义的函数?

时间:2016-10-12 07:58:56

标签: javascript requirejs

我猜是关于main.js,但我已经尝试了我在网上找到的所有例子,但他们只是没有用。

我目前有:三个模块(one.js,two.js,three.js),main.js,index.html和一些像require.js这样的参考文件

class InternationalFlightMiddleware { public function handle($request, Closure $next) { app()->register('aunicaj\Providers\InternationalTravelServiceProvider'); } }

one.js

define("one",['./two', './three'], function(two, three) { var one = 1; return { value: function(e){ return one; } } });

two.js

define("two",['./one', './three'], function(one, three) { var two = 2; return { value: function(){ return two; } } });

main.js

我的HTML:

require(["one", "two", "three"], function (one, two, three) {

});

2 个答案:

答案 0 :(得分:0)

调用onload函数与requiremain.js回调调用的概念相同。你只需要在require的回调中调用函数:

require(["one", "two", "three"], function (one, two, three) {
  one.value();
});

所有require的回调参数都是对define创建的函数的引用。它们内部的相同方法之间不会有任何冲突。

答案 1 :(得分:0)

你不能按照你想要的方式去做。你的电话:

require(["one", "two", "three"], function (one, two, three) { });

会加载您的模块,但随后它们的值可通过回调参数获得。 不会将任何内容导出到全局空间。但要使<body onload="value();">生效,value必须位于全局空间中。

另一个问题是RequireJS是异步的。因此,即使您重写了代码以故意让模块two将其value泄漏到全局空间,代码也无法可靠地工作。通常,您无法知道何时{ {1}}调用将在require body被解雇时完成。

你可以通过粘合代码&#34;解决问题。加载你需要的东西。设置onload并在<body onload="onBodyLoaded()">之前设置script,其中包含:

body

如果这是我的代码,我实际上并没有使用function onBodyLoaded() { require(["two"], function (two) { two.value(); }); } 属性,而是在身体之后有一个onload,例如:

script

或者我使用domReady plugin。这与在(function () { document.body.addEventListener("load", function onBodyLoaded() { require(["two"], function (two) { two.value(); }); }); }()); 上收听load事件并不完全相同,但它可能足够好&#34;。