Question

我正在尝试执行一个简单的get请求来从此API中提取随机引用。硬编码更改按钮单击时的引用可以正常工作。

$(document).ready(function() {
  $("#quotebtn").on('click', function(e) {
    e.preventDefault();
    $.ajax({
      type: 'GET',
      url: 'http://quotes.stormconsultancy.co.uk/random.json',
      success: function(data) {
        var post = data.shift(); //get the first quote
        $('#quote').html(post.content); //change the html to the quote

      },
      cache: false
    });
    // $("#quote").html("You clicked!");
  })
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="body">
  <h1>Quote Machine</h1>
  <div id="quote">Here is the quote</div>
  <button id="quotebtn" type="button" class="btn btn-primary">
     Button
   </button>
</div>

Answer 1

根据您的评论：Customer | transaction_id | medium | first_transaction_flag | first_channel ABC 12345 organic Y Y ABC 23456 email 0 0 ABC 34567 organic 0 Y BCD 45678 organic 0 0 BCD 56789 referral 0 0，您不应该混合使用HTTP和HTTPS。您查询的页面没有安全对应的页面。

除了混合内容之外，服务器的响应不是数组，是一个对象，你可以Mixed Content: The page at 'codepen.io/stepup2stepout/pen/gxZVWz?editors=1010'; was loaded over HTTPS...个对象，只有数组。

而不是：

.shift()

尝试：

function(data) {
    var post = data.shift(); //get the first quote
    $('#quote').html(post.content); //change the html to the quote
  }

Mixed Content (MDN)

Answer 2

从api返回的数据;

{
    "author": "Charles Babbage",
    "id": 8,
    "quote": "On two occasions I have been asked, \u2018Pray, Mr. Babbage, if you put into the machine wrong figures, will the right answers come out?\u2019 I am not able rightly to apprehend the kind of confusion of ideas that could provoke such a question.\u201d",
    "permalink": "http://quotes.stormconsultancy.co.uk/quotes/8"
}

如您所见，它不是数组，因此您不需要data.shift()。只是做;
$('#quote').html(data.quote); 就够了。

Answer 3

API返回单个JSON对象而不是Array。因此没有必要进行轮班操作。

下面的代码应该可以解决这个问题。

Template.blockAddThis.onRendered(function() {
    addthis.layers.refresh();
});

简单API获取请求不起作用

3 个答案: