Ajax跨源请求被阻止：同源策略不允许读取远程资源

我正在编写一个简单的网站，它以习语作为输入，并从牛津词典返回其含义和示例。这是我的想法：

我向以下 URL 发送请求：

http://www.oxfordlearnersdictionaries.com/search/english/direct/?q=[idiom]

例如，如果成语是“not go far”，我将向以下地址发送请求：

http://www.oxfordlearnersdictionaries.com/search/english/direct/?q=not+go+far

我将被重定向到以下页面：

http://www.oxfordlearnersdictionaries.com/definition/english/far_1#far_1__192

在此页面上，我可以提取该成语的含义和示例。
这是我的测试代码。它将提醒响应 URL：

<input id="idiom" type="text" name="" value="" placeholder="Enter your idiom here">
<br>
<button id="submit" type="">Submit</button>
<script type="text/javascript">
$(document).ready(function(){
    $("#submit").bind('click',function(){
        var idiom=$("#idiom").val();
        $.ajax({
            type: "GET",
            url: 'http://www.oxfordlearnersdictionaries.com/search/english/direct/',
            data:{q:idiom},
            async:true,
            crossDomain:true,
            success: function(data, status, xhr) {
                alert(xhr.getResponseHeader('Location'));
            }
        });
        
    });
});
</script>

问题是我有一个错误：

跨源请求被阻止：同源策略不允许读取远程资源http://www.oxfordlearnersdictionaries.com/search/english/direct/?q=by+far http://www.oxfordlearnersdictionaries.com/search/english/direct/?q=by+far。这可以通过将资源移动到同一域或启用 CORS 来解决。

有人可以告诉我如何解决这个问题吗？
另一种方法也很好。

JSONP 或“JSON with padding”是一种在 Web 浏览器中运行的 JavaScript 程序中使用的通信技术，用于从不同域中的服务器请求数据，但由于同源策略，典型的 Web 浏览器禁止这样做。 JSONP 利用了浏览器不对脚本标签强制执行同源策略的事实。 请注意，要使 JSONP 正常工作，服务器必须知道如何使用 JSONP 格式的结果进行回复。 JSONP 不适用于 JSON 格式的结果。

http://en.wikipedia.org/wiki/JSONP http://en.wikipedia.org/wiki/JSONP

StackOverflow 上的好答案：jQuery AJAX 跨域 https://stackoverflow.com/questions/3506208/jquery-ajax-cross-domain

$.ajax({
  type: "GET",
  url: 'http://www.oxfordlearnersdictionaries.com/search/english/direct/',
  data:{q:idiom},
  async:true,
  dataType : 'jsonp',   //you may use jsonp for cross origin request
  crossDomain:true,
  success: function(data, status, xhr) {
    alert(xhr.getResponseHeader('Location'));
  }
});