javascript - 为什么这个函数在 ajax 调用后执行时停止工作?

标签 javascript jquery ajax

我有 following jsfiddle

<style>
  .line {
    fill: none;
    stroke: steelblue;
    stroke-width: 2px;
  }
</style>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
  var data = [{ "date": "1-May-10", "close": 2 }, { "date": "1-May-12", "close": 7 }];
  var result = { // a mock version of our response
    "javascript": ["https://cdnjs.cloudflare.com/ajax/libs/d3/4.13.0/d3.js", "https://cdn.jsdelivr.net/gh/nottoobadbutgoodname/tester/chart.js"
    ]
  }

  function loadAll(resultt) { // throwaway var resultt as we are using our mock result
    console.log("loading....");
    getMultiScripts = function (arr) {
      var _arr = $.map(arr, function (scr) {
        return $.getScript(scr);
      });
      _arr.push($.Deferred(function (deferred) {
        $(deferred.resolve);
      }));
      return $.when.apply($, _arr);
    }
    getMultiScripts(result.javascript.slice(0, -1)).done(function () {
      $("<script/>", {
        src: result.javascript[result.javascript.length - 1]
      }).appendTo("body");
    });
  }

  function main() {
    $(document).ready(function () {
      $.ajax({
        url: "http://127.0.0.1:8000",
        success: loadAll
      });
    });
  }

  main(); // doesn't work
  //loadAll(result); // works!
</script>

直接运行 loadAll(result) 可以工作,但是当我用 ajax 调用尝试它时,它会无提示地失败。本质上,ajax 调用会获取一些 .js 文件,然后将其加载。运行 main 将获取脚本,但似乎不会执行它们(两者的状态代码都是 200,但 chart.js 的状态代码在运行 main() 时变灰,但在运行 loadAll() 时变黑

编辑:

这很奇怪。因为在这个例子中我只是在 mock 我想我会尝试一个实验的结果:

https://jsfiddle.net/rwzm4t75/4/

基本上,我将其转换为 JSONP 调用并获取一些随机 JSONP 数据并将 loadAll 转换为 jsonCallback 函数。该图表现在正在持续加载,但不幸的是,对于“真实世界”,结果无法被模拟,并且数据以 JSON 而不是 JSONP 的形式出现。

明确地说,我已经在我的真实应用程序和 JSONP 中尝试了 JSON 响应。 JSON 版本有时会加载但不一致。始终加载 JSONP 版本。

最佳答案

尝试在准备好的文档中执行 main():

$(document).ready(function () {
    main();
});

function main() {
    $.ajax({
      url: "http://127.0.0.1:8000",
      dataType: 'JSON',
    })
    .done(function(result)){
       loadAll(result);
    });
}

关于javascript - 为什么这个函数在 ajax 调用后执行时停止工作?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54757762/

相关文章:

javascript - 在 Formik 中添加 react-bootstrap 警报以处理提交

javascript - 如何在不刷新的情况下加载新内容到DIV

javascript - MVC - 链接到另一个 Controller /操作时出现问题

javascript - 使用 Canvg 将 svg 转换为 png : "target.childnodes is undefined" error

javascript - 下拉列表选择在 Internet Explorer 中无法正常工作

JavaScript 地理编码不启动搜索

javascript - jQuery/JavaScript - 使用 Ajax 加载 iframe 会减慢页面速度

javascript - Angular 2 中 <template *ngFor 的等价物是什么?

javascript - document.writeln 没有按预期工作

javascript - 使用 javascript 技巧编辑网页 - 如何 "unedit"?