如何让我的脚本相互交互？

Question

当我的网页加载完毕后，它会运行这个脚本：

$(function() {
  return $.ajax({
    type: "get",
    dataType: "json",
    url: "/get_script",
    success: function(data, status, xhr) {
      return $("#myScript").html(data.myScript);
    }
  });
});

脚本从我的服务器获取另一个脚本（data.myScript 对象）。添加到我的网页的新脚本如下所示：

<script>
  initScript = function() {
    return window.random_string = Math.random().toString(36).substring(7);
  };

  $(window).bind("popstate", 'hashchange', function() {
    return initScript();
  });

  window.random_string = null;
  initScript();
</script>

如果新脚本需要为网页上的其他脚本提供变量，我将它们放入 window.my_variable 变量中，但我希望能够调用例如MyScript.random_string.

我还希望能够从其他脚本触发initScript 函数。就像例如MyScript.initScript()

我如何做到这一点？

Answer 1

首先我建议使用$.getScript 来加载你的JS 代码，假设你不能将它直接嵌入到<script> 标记中。

要解决您的实际问题，您只需按照您需要的方式构建它。只需创建一个像var MyScript = {}; 这样的对象，然后将所有函数和变量作为属性放在该对象中，如下所示：

$.getScript('/get_script', function() {
  // put logic to run after the script has loaded here...
  // note that you don't need your .html(data.myScript) any more
  
  MyScript.initScript();
  console.log(MyScript.random_string);
});

// in your external script:
var MyScript = {
  initScript = function() {
    this.random_string = Math.random().toString(36).substring(7);
  },
  random_string: null;
}