javascript - 页面刷新时的新报价

Question

我正在制作一个报价机并且新的报价按钮可以工作，但是我该如何做到这一点，以便在您加载/刷新页面时已经加载新的报价？现在你必须点击“+”按钮才能得到一个。

fiddle :https://jsfiddle.net/hanyb9da/18/

报价变更代码:

$('#random-quote').click(function() {
    var randomIndex = Math.floor(Math.random() * quotes.length);
    var selectedQuote = quotes[randomIndex];

    $('#main-quote').text(selectedQuote.quote);
    var selectedBG = selectedQuote.background;
    console.log(selectedBG);
    $("body").css("background-image", "url('" + selectedBG + "')");
  });

谢谢你:)

Answer 1

为此，您可以在设置事件处理程序后立即触发点击事件:

$('#random-quote').click(function() {
    // your code here...
}).trigger('click'); // or just .click()

或者，您可以将生成和显示报价的逻辑放入它自己的函数中，您可以在单击按钮和加载页面时调用该函数，如下所示:

function getQuote() {
    var randomIndex = Math.floor(Math.random() * quotes.length);
    var selectedQuote = quotes[randomIndex];

    $('#main-quote').text(selectedQuote.quote);
    var selectedBG = selectedQuote.background;
    console.log(selectedBG);
    $("body").css("background-image", "url('" + selectedBG + "')");
}

$('#random-quote').click(getQuote); // on click
getQuote(); // on load

Updated fiddle