javascript - 为什么这个函数在ajax调用后执行时停止工作?
问题描述
<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() 时显示为黑色
编辑:
这很奇怪。因为在示例中我只是在嘲笑我想尝试一个实验的结果:
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);
});
}
推荐阅读
- angularjs - 预填充值时禁用输入字段
- google-sheets-api - 使用 gspread 和 Google sheet API 将工作表复制到多个工作簿
- nebular - Nebular:Layout-Header 如何向组件添加引导下拉菜单
- python - Pandas - 根据另一个数据框列中的值删除列
- python - 使用 While 循环检查用户的输入(字符串)是否属于列表?
- python - 安装了 PyCharm 和 Anaconda,但无法启用 Pandas 和 NumPy
- javascript - VBA 检查网页中的警报
- c# - 如何在 asp.net mvc core 2.0 中维护会话值
- c++ - GCC:“BLAH 的定义不在命名空间中”
- r - 使用 read.csv.sql 函数并加载数据的子集