无法读取未定义的属性 'search'（维基百科 API）

Question

我正在浏览维基百科 API 但我一直收到错误；

"Cannot read property 'search' of undefined"

有人可以解释我做错了什么吗？当用户使用搜索栏尝试查找内容时，我将使用 .map 浏览数据并将数据结果粘贴到我的 resultDiv 中。

这是我的代码；＆一个强制性的codepen。 http://codepen.io/pixeluh/pen/wMdpbM?editors=101

$(document).ready(function() {

  var searchBar = $("#search");
  var resultDiv = $(".results");
  var goButton = $("#go");

  $.ajax({
    url: "http://en.wikipedia.org/w/api.php?",
    data: {
      action: 'query',
      list: 'search',
      srsearch: searchBar.val(),
      format: 'json'
    }, //end of data
    dataType: 'jsonp',
    success: function(data){
        var datatp = '';
        data.query.search.map(function(f) {
            datatp += f.title;
            datatp += f.snippet;
          }) //end of map
        resultDiv.html(datatp);
      } //end of success
  }); //end of ajax

}); //end of body func

<html>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<container id="page">
  
  <div id="flex-container">
  <div class="search-bar">
    <form class="searchbar">
      <input type="search" name="wikisearch" placeholder="Search wiki..." id="search">
      <input type="submit" id="go" value="Go"/>
      
      <input type="button" id="random" value="Random" onclick="window.location ='http://en.wikipedia.org/wiki/Special:Random';"/>
      
    </form>
   
  </div>
  </div>
  
  <div class="results">
    <!-- search results go here-->
  </div>
  
</container>
</html>

感谢任何帮助或指导，谢谢。

Answer 1

您正在调用 ajax 准备就绪，但它应该像这样提交：

$(document).ready(function() {

  var searchBar = $("#search");
  var resultDiv = $(".results");
  var goButton = $("#go");
  $('form').submit(function() {
    $.ajax({
      url: "https://en.wikipedia.org/w/api.php?",
      data: {
        action: 'query',
        list: 'search',
        srsearch: searchBar.val(),
        format: 'json'
      }, //end of data
      dataType: 'jsonp',
      success: function(data){
          var datatp = '';
          data.query.search.map(function(f) {
              datatp += f.title;
              datatp += f.snippet;
            }) //end of map
          resultDiv.html(datatp);
        } //end of success
    }); //end of ajax
    return false;
  });
}); //end of body func

JSFIDDLE

无法读取未定义的属性 'search'（维基百科 API）

Cannot read property 'search' of undefined (Wikipedia API)

javascript

api

json

wikipedia

无法读取未定义的 属性 'search'（维基百科 API）

Cannot read property 'search' of undefined (Wikipedia API)

javascript

api

json

wikipedia

无法读取未定义的属性 'search'（维基百科 API）