維基百科API沙盒，按用戶輸入搜索

試圖在用戶輸入的維基百科中進行搜索，但由於某種原因它不起作用。首先，我認爲這可能是由於跨域問題。但.ajax應該有所幫助。維基百科API沙盒，按用戶輸入搜索

這裏是codepen：http://codepen.io/ekilja01/pen/pRerpb

這裏是我的HTML：

<script src="https://use.fontawesome.com/43f8201759.js"> 
</script> 


<body> 

    <h2 class="headertext">WIKIPEDIA <br> VIEWER </h2> 


    <div class="row"> 
    <div class="col-10-md"> 

     <input class="searchRequest blink_me" id="cursor" type="text" placeholder="__"></input> 

    </div> 

    <div class="searchIcon col-2-md"> </div> 
    </div> 

<div> 
    <p class=results></p> 
</div> 


</body>

這裏是我的jQuery ：

$(document).ready(function() { 

    var icon = "<i class='fa fa-search fa-2x'></i>"; 

    $('#cursor').on("keydown", function() { 
    $(this).removeClass("blink_me"); 
    var searchIcon = $(".searchIcon"); 

    searchIcon.empty(); 
    if ($(".searchRequest").val().length > 0) { 
     searchIcon.append(icon); 
    } 






    searchIcon.on("click", function() { 
console.log("clicked!"); 


     var search = $(".searchRequest").val(); 

     var url = "https://en.wikipedia.org/w/api.php?action=opensearch&format=json&search=" + search + "&format=json&callback=?"; 

     $.ajax({ 
     dataType: "jsonp", 
     url: url, 
     success: function(data) { 
      $(".results").html(data[0]); 

      console.log(data[0]); 
      } 

     }); 
    }); 
    }); 
});

我究竟做錯了什麼？請幫忙。

來源

2017-01-22 Alina Khachatrian

您的js的加載順序出現錯誤。

的data對象包含索引2，我假設數組中的結果的文本要顯示什麼，將其更改爲

$(".results").html(data[2]);

可以檢查你的原始代碼的修改版這裏

http://codepen.io/anon/pen/mRmGXG

來源

2017-01-22 21:55:40

它有點不對勁$（「結果」）。HTML（[2]），但我得到了它。必須是$（「。results」）。html（data [2]。非常感謝！ –

我忘了點擊保存按鈕，現在應該沒事了。 –

能否請你進一步告知我如何獲得所有10個結果已被發現顯示在頁面上？我想我必須使用每個？ –

維基百科API沙盒，按用戶輸入搜索

回答

相關問題