$ .getJSON不返回結果

我需要製作一個頁面，允許用戶搜索以獲得維基百科頁面及其結果。

相關的HTML是：

<form class='search-form' onsubmit='return false'> 
    <input class='search-input' id="search-input" type="text" /> 
    <button class='btn search-btn'><i class="fa fa-search" aria-hidden="true"></i></button> 
</form>

而且JS是：

$(document).ready(function() { 
    $(".search-btn").on("click", function() { 
    $.getJSON(
     "https://en.wikipedia.org/w/api.php?action=opensearch&search=te&format=json", 
     function(data) { 
     alert(JSON.stringify(data)); 
     } 
    ); 
    }); 
});

一旦我得到這個警報跑，我需要改變警報以打開一個窗口，其中包含一個URL在JSON數據中，但當我接近它時，我會穿過那座橋。目前，JSON完全沒有做任何事情。

來源

2017-08-27 alton1231

不幸的是，你永遠不會有，因爲該URL沒有CORS標題，並且無法從客戶端代碼 – adeneo

訪問這是什麼意思？ – alton1231

這基本上意味着你做得不對，因爲使用ajax無法從瀏覽器訪問URL。但是，如果使用正確的參數，維基百科確實會支持JSONP。 – adeneo

下面是如何使維基百科的請求返回JSONP，這使得它可以做到跨域請求不CORS頭

function getWiki(query) { 
 
    return $.ajax({ 
 
    url: 'https://en.wikipedia.org/w/api.php', 
 
    data: { 
 
     format: 'json', 
 
     action: 'opensearch', 
 
     search: query 
 
    }, 
 
    jsonp: "callback", 
 
    dataType: 'jsonp' 
 
    }); 
 
} 
 

 
$('.search-form').on('submit', function(e) { 
 
    e.preventDefault(); 
 
    var q = $('#search-input').val(); 
 
    
 
    getWiki(q).done(function(data) { 
 
     console.log(data); 
 
    }).fail(function(err) { }) 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<form class='search-form'> 
 
    <input class='search-input' id="search-input" type="text" /> 
 
    <button class='btn search-btn'>Search</button> 
 
</form>

來源

2017-08-27 04:17:22 adeneo

$ .getJSON不返回結果

回答

相關問題