1
我想實現對以下JavaScript代碼的承諾,但process.then函數從來沒有實際發生的某種原因。任何人都能看到爲什麼我已經建立了新的承諾,它執行正如我與控制檯日誌測試它,但它從來沒有執行。那麼功能JavaScript承諾沒有執行然後
感謝
function connect() {
'use strict';
//User Input
var query = document.getElementById('query').value;
//API key & URL
var apiUrl = 'https://community-wikipedia.p.mashape.com/api.php?action=opensearch&search=' + query + '&limit=20&namespace=0&format=json';
var apiKey = "xxxxx";
//While requesting the data from API set the innerHTML to loading.
//document.getElementById('suggestions').innerHTML='Loading your request...';
document.getElementById('spin').style.display = 'inline';
//Process the JSON data
var process = new Promise(function (resolve, reject) {
//Method for connecting to API
var httpRequest = new XMLHttpRequest();
//Opening the API URL
httpRequest.open('GET', apiUrl, true);
httpRequest.setRequestHeader("X-Mashape-Key", apiKey);
httpRequest.send(null);
//When state has changed then triggers processResponse function
httpRequest.onload = function() {
//Checks the response codes
if (httpRequest.readyState === 4) {
//document.getElementById('suggestions').innerHTML='';
if (httpRequest.status === 200) {
var response = JSON.parse(httpRequest.responseText);
//Clear any previous results
document.getElementById('suggestions').innerHTML = '';
//Remove spinner when data is input
document.getElementById('spin').style.display = 'none';
resolve(response);
} else {
alert('There was a problem with the request');
reject('No Good!');
}
}
}
process.then (function(response) {
//Set response to response
var response = response;
//Grab suggestions div from DOM
var suggestions = document.getElementById('suggestions');
//Create new element UL
var list = document.createElement('UL');
//Create new elements for li's
var newLi, newText;
//For all the text nodes
var textNodes = [];
//For all the li's
var liList = [];
//For all the links
var links = [];
//For loop to add and append all suggestions
for (var i = 0; i < response[1].length; i++) {
//Replace spaces with underscore
var setHTML = response[1][i].replace(/\s/g, '_');
//Creates the appropriate link
var link = 'http://en.wikipedia.org/wiki/'+setHTML;
//Create new a elements in array
links[i] = document.createElement('a');
//Adds the link to links array
links[i].href = link;
//Create new text node with the response from api
textNodes[i] = document.createTextNode(response[1][i]);
//Create a new element 'li' into array
liList[i] = document.createElement('li')
//Append the response(textnode) to the a in the array
links[i].appendChild(textNodes[i]);
//Append the a to the li in the array
liList[i].appendChild(links[i]);
//Append the li to the UL
list.appendChild(liList[i]);
}
//Append the UL to the suggestions DIV
suggestions.appendChild(list);
}
)}
)}
function init() {
'use strict';
document.getElementById("query").addEventListener("keyup", connect);
}
window.onload = init;
真棒,它的工作原理,謝謝:)我瞭解var response = response我只是把它放在那裏,以防萬一它沒有正確地選擇它。但現在我看到沒有意義! – Adam91Holt 2014-11-04 14:38:20
@ Adam91Holt:不客氣!總是樂於成爲幫助:-) – Cerbrus 2014-11-04 14:42:34