我正在创建一个函数来输出外部JSONP脚本(返回挪威邮政城市)。我有它工作,但是,它很慢。在开发人员工具的网络选项卡中,有时需要2秒才能加载脚本并将结果返回到<output>
(我怀疑它在我不看的时候花了更多时间)。
我还看到我的函数在JSONP输出代码上返回一个控制台错误,我不知道为什么 - 根据我的经验,控制台错误使一切都停止工作,但即使它很慢,它返回邮政城市正如预期的那样。
它说的是Unable to get the property postal_codes when it is undefined or has a null reference
。这是导致缓慢的原因吗?我已将我的代码复制到JSLint以检测代码中的错误,但没有任何关于此的内容。
这是我(我认为简单的)代码:
var output = document.querySelector("output"),
input = document.querySelector("input");
function nr(data) {
output.textContent = data.postal_codes[0].city; // returns console error on postal_codes but works
}
function postalcode() {
if(input.value.length == 4) {
if(document.getElementById("json")) { // if the script already exists, remove before re-appending
document.getElementById("json").parentNode.removeChild(document.getElementById("json"));
}
var script = document.createElement("script");
script.src = "http://adressesok.posten.no/api/v1/postal_codes.json?postal_code=" + input.value + "&callback=nr";
script.defer = true;
script.id = "json";
script.onerror = function() { // when the script src returns 404
output.textContent = "Invalid number";
};
// the below should only load when script src doesn't return 404 (onerror), onload doesn't work
document.head.appendChild(script);
nr();
}
else if(!input.value.length) {
output.textContent = "";
}
else {
output.textContent = "Has to be 4 digits";
}
}
input.addEventListener("keyup", postalcode);
input.addEventListener("paste", postalcode);
Fiddle - 尝试插入类似2000,1112和1448的数字,这些数字应该有效,而1111和9999这样的数字不是真正的邮政编码,会返回404错误。