您可以在一个请求中检索文本和图像,请尝试以下操作:
$(document).ready(function () { var articles = $('.articles'); var input = $('input'); var button = $('button'); var toSearch = ''; var searchUrl = 'https://en.wikipedia.org/w/api.php'; var ajaxArticleData = function () { $.ajax({ url: searchUrl, dataType: 'jsonp', data: { //main parameters action: 'query', format: 'json', generator: 'search', //parameters for generator gsrsearch: toSearch, gsrnamespace: 0, gsrlimit: 10, prop: 'extracts|pageimages', //parameters for extracts exchars: 200, exlimit: 'max', explaintext: true, exintro: true, //parameters for pageimages piprop: 'thumbnail', pilimit: 'max', pithumbsize: 200 }, success: function (json) { var pages = json.query.pages; $.map(pages, function (page) { var pageElement = $('<div>'); //get the article title pageElement.append($('<h2>').append($('<a>').attr('href', 'http://en.wikipedia.org/wiki/' + page.title).text(page.title))); //get the article image (if exists) if (page.thumbnail) pageElement.append($('<img>').attr('width', 150).attr('src', page.thumbnail.source)); //get the article text pageElement.append($('<p>').text(page.extract)); pageElement.append($('<hr>')); articles.append(pageElement); }); } }); }; input.autocomplete({ source: function (request, response) { $.ajax({ url: searchUrl, dataType: 'jsonp', data: { 'action': "opensearch", 'format': "json", 'search': request.term }, success: function (data) { response(data[1]); } }); } }); button.click(function () { articles.empty(); toSearch = input.val(); ajaxArticleData(); });});<!DOCTYPE html><html><head> <title>My Wikipedia Viewer</title> <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/themes/smoothness/jquery-ui.css" /></head><body> <section> <input type='text' value='' placeholder='Search for...'> <button>Search</button> </section> <section ></section> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js"></script></body></html>


