javascript - JSONP 脚本回调不起作用

Question

我想在使用纯 JavaScript 加载脚本后执行回调。我能够正确加载脚本，但我的回调没有触发。我听说使用 JSONP 我可以做这种类型的事情，但是，我不能完全让它工作。这是我的代码:

function foo(){
   alert('got the data');
}

var el = document.createElement("script");
el.setAttribute("src", "//ajax.googleapis.com/ajax/libs/webfont/1.5.0/webfont.js?callback=foo");
document.body.appendChild(el);

Answer 1

JSONP 与此无关。您尝试加载的 URL已经 返回 JavaScript，因此您需要将加载事件处理程序绑定(bind)到该元素:

var el = document.createElement("script");
el.setAttribute("src", "//ajax.googleapis.com/ajax/libs/webfont/1.5.0/webfont.js");
el.onload = function() {
    // script loaded
};
document.body.appendChild(el);

另请参阅How do I include a JavaScript file in another JavaScript file?

<小时/>

当您想要从外部域加载数据时，JSONP 可以用作 Ajax 的替代方案，但服务器必须支持它。如果服务器支持，则不返回(例如)简单的 JSON:

{"foo": 42}

它将其包装在 callbackName(...); 中，以通过单个函数调用创建 JS 脚本:

callbackName({"foo": 42});

实际的函数名称取自 GET 参数callback。