我的javascript模块无效,错误与未定义

时间:2016-03-31 16:28:19

标签: javascript

我有一个js文件,其中包含以下内容:

;
var tracker = (function () {

    var _track = function(userId, atts) {
        alert(userId);
    };


    return {
        track: function (userId, atts) {
            _track(userId, atts);
        }
    }
}());

我正在使用我看到其他服务正在执行的模式加载javascript:

<script>
(function(w, d, js) {
    var f = d.getElementsByTagName('script')[0],
        s = d.createElement('script');
    s.async = true;
    s.src = js;
    f.parentNode.insertBefore(s, f);
})(window, document, '//localhost/WebApp1/Assets/tracker/tracker.js');

var userAtts = {
        'foo': 1,
        'bar': 2,
        'some-invalid-identifier': 3
    };

    $(document).ready(function() {
        tracker.track(3213, userAtts);
    });
</script>

我收到此错误:

(index):107 Uncaught ReferenceError: tracker is not defined.

我无法弄清问题是什么。

2 个答案:

答案 0 :(得分:0)

在尝试使用tracker函数之前,您需要确保已加载外部JS。

一种超简单的方法就是在创建跟踪器之前继续尝试:

var trackerLoadedListener = setInterval(function(){
  if (typeof tracker !== 'undefined'){
    clearInterval(trackerLoadedListener);
    // Your function call / code here, should only execute once tracker is available
  }
}, 500)

或者,您可以从添加脚本的函数编写回调函数。但是,我不知道在您的代码中添加脚本与处理/使用脚本之间是否存在任何延迟。

答案 1 :(得分:0)

在加载脚本时调用tracker的另一种方法是将处理程序添加到 onload 事件,并直接传递,或使用 promises

例如:

var trackerPromise = (function(w, d, js) {
  return new Promise(function(resolve) {
    var f = d.getElementsByTagName('script')[0],
      s = d.createElement('script');  
    s.async = true;
    s.src = js;
    s.onload = resolve;
    f.parentNode.insertBefore(s, f);

  });
})(window, document, 'script.js');

并使用此代替jQuery ready函数

trackerPromise.then(function() {
  tracker.track(3213, userAtts);
});

Sample plunkr