无法从维基百科获取数据API

Question

我正在“维基百科查看器”项目上工作，您在此输入搜索词并查看维基百科搜索结果列表，但它的编号为远不是完整。

到现在为止，我刚才编写了代码来显示第一个搜索项。但它不起作用。

我的HTML：

<div class="container-fluid"> 
 

 
<div class="searchAndButtons"> 
 
    
 
<input type="text" id="search"> 
 
    <button class="btn" id="searchBut">Search</button> 
 
    <form action="https://en.wikipedia.org/wiki/Special:Random"><button class="btn">Random Wiki Article</button> 
 
    </form> 
 
    </div> 
 
    <div class="searchResults"> 
 
    </div> 
 
    
 
    
 
    </div>

我的CSS：

.container-fluid{ 
 
    padding:5%; 
 
} 
 
.searchAndButtons{ 
 
    text-align:center; 
 
}

我的javascript：

$(document).ready(function(){ 
 
    $("#searchBut").on("click",function(){//this is click handler 
 
    var searchTerm=document.getElementById("#search").value; 
 
    searchTerm=searchTerm.replace(/\s/g,"+"); 
 
    
 
    $.getJSON("http://en.wikipedia.org/w/api.php?action=query&prop=revisions&titles="+searchTerm+"&rvprop=content&format=json&rvsection=0&rvparse=1",function(json){ 
 
     $(".searchResults").html(JSON.stringify(json)); 
 

 
     }); 
 
    }); 
 
    }); 
 

我要去哪里错了？当我在Codepen中运行代码并检查控制台时，它显示“TypeError：document.getElementById（...）为null”的错误。 我的项目上codepen - link

Answer 1

$(document).ready(function(){ 
    $("#searchBut").on("click",function(){//this is click handler 
    var searchTerm=document.getElementById("search").value; 
    searchTerm=searchTerm.replace(/\s/g,"+"); 

    $.getJSON("http://en.wikipedia.org/w/api.php?action=query&prop=revisions&titles="+searchTerm+"&rvprop=content&format=json&rvsection=0&rvparse=1",function(json){ 
     $(".searchResults").html(JSON.stringify(json)); 

     }); 
    }); 
    }); 

更新与此您的JS代码。 ID通过“搜索”而不是“＃搜寻”

UPDATE得值：要添加标题，你可以做以下

$(document).ready(function(){ 
     $("#searchBut").on("click",function(){//this is click handler 
     var searchTerm=document.getElementById("search").value; 
     searchTerm=searchTerm.replace(/\s/g,"+"); 



    $.ajax({ 
       url: 'http://en.wikipedia.org/w/api.php?action=query&prop=revisions&titles="+searchTerm+"&rvprop=content&format=json&rvsection=0&rvparse=1', //your request URL 
       type: 'GET', 
       dataType: 'json', 
       success: function() { alert('hello!'); }, 
       error: function() { alert('boo!'); }, 
       beforeSend: setHeader 
      }); 
      }); 

      function setHeader(xhr) { 
      xhr.setRequestHeader('securityCode', 'Foo'); //your header key and value 
      } 

     }); 
     });