无法使用html表单元素从JSON获取信息以及使用Wikimedia从getJSON方法获取信息

Question

I'm trying to submit something to search with the form and pull info from the j son

 $("#target1").submit(function(e) { e.preventDefault(); var x = document.getElementById("input").value; var url = "https://en.wikipedia.org/w/api.phpaction=query&format=json&prop=revisions&list=search&titles=&rvprop=content&srsearch=" + x; var the = function(teh) { $("#target2").text(teh.continue.continue); } $.getJSON(url, the); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form action="" method="" id="target1"> <input class='text-center' type='text' id='input' placeholder='Search Wikipedia' required> </form> <div class='text-center'> <p id='target2'></p> </div> 

example link of json: https://en.wikipedia.org/w/api.php?action=query&format=jsonfm&prop=revisions&list=search&titles=&rvprop=content&srsearch=cats

I am trying to get the info from the titles but im just using the "continue" to make it shorter.
full code at http://codepen.io/nunez7890/pen/aWWXqy

Answer 1

Looks like it's CORS issue. Refer here for solution Wikipedia API + Cross-origin requests

Add origin=* to the URL query params.

$("#target1").submit(function(e) {
  e.preventDefault();
  var x = document.getElementById("input").value;
  var url = "https://en.wikipedia.org/w/api.php?origin=*&action=query&format=json&prop=revisions&list=search&titles=&rvprop=content&srsearch=" + x;
  var the = function(teh) {
    $("#target2").text(teh.continue.continue);
  }
  $.getJSON(url, the);
});