如何执行Ajax请求？

Am trying to make wikipedia viewer for my freecodecamp project. But the ajax request fails every time. It does not return anything.

var url, value;
$(document).ready(function() {
  $("button").on("click", function() {
    value = $("input").val();
    var url = "https://en.wikipedia.org/w/api.php?action=opensearch&search=" +
      value + "&format=json&callback=?";
    $.ajax({
      type: "GET",
      url: url,
      async: false,
      dataType: "json",
      //jsonp: "callback",
      success: function(data) {
        console.log(data);
      }
    });
  });
});

</div>

set dataType: 'jsonp'
remove &callback=? from the url (that's the default that jQuery will use anyway

example

var value = "google";
var url = 'https://en.wikipedia.org/w/api.php?action=opensearch&search='+ value + '&format=json';
$.ajax({
    type: 'GET',
    url: url,
    dataType: 'jsonp',
    success: function (data)
    {
        console.log(data);
    }
});

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

</div>

Use this code:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="search" /><br /><br />
<button>Click here</button>
<script>
    var url, value;
    $(document).ready(function() {
      $("button").on("click", function() {
        value = $("input").val();
        var url = "https://en.wikipedia.org/w/api.php?action=opensearch&search=" +
          value + "&format=json";
        $.ajax({
          type: "GET",
          url: url,
          async: false,
          dataType: "jsonp",
          success: function(data) {
            console.log(data);
          }
        });
      });
    });
</script>

</div>