有人可以纠正我的javascript代码?(免费代码营)

Can someone correct my javascript code? (Free code camp)

本文关键字：代码 免费代码 javascript 我的      更新时间：2023-09-26

我一般是从免费代码营学习javascript。目前正在做关于生成随机报价的问题。我不知道为什么它不更新当我点击我的按钮。有人能看一下并评论一下吗?

http://codepen.io/NateAlcedo/pen/mOdBzZ

这是我的脚本

$(document).ready(function() {
  var url = "http://api.forismatic.com/api/1.0/?method=getQuote&lang=en&format=json";
 // on click event, obtain an instance of the data from api
  $("#buttonGenerator").on("click", function() {
    $.getJSON(url, function(data){
    $("#quote").html(data.quoteText);
      $("#author").html(data.quoteAuthor);
    });
  });
});

了解forismatic提供的jsonp api。我还以为你还能达到最初的目标呢。

你可能想看CORS。

由于这种访问控制，jsonp API出现了。

你的代码是好的(只是需要找到正确的API为我们的需求!)

$(document).ready(function() {
    var url = "http://api.forismatic.com/api/1.0/?method=getQuote&lang=en&format=jsonp&jsonp=?";
    // on click event, obtain an instance of the data from api
    $("#buttonGenerator").on("click", function() {
        
        $.getJSON(url, function(data){
            $("#quote").html(data.quoteText);
            $("#author").html(data.quoteAuthor);
        });
    });
});
    <html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
        <script type="text/javascript" src="script.js"></script>
    </head>
    <body>
    <div class="jumbotron text-center">
        <h1 style="color: #1287A8">
            Random Quote Machine
        </h1>
        <hr size="" />
    </div>
    <div class="container">
        <div class="row">
            <!--Left button-->
            <div class="col-md-2">
                <button id="buttonGenerator"type="button" class="btn btn-info">
                    <p id="buttonText">Generate Quote</p>
                </button>
                <br />
                <br />
                <button id="buttonTwitter"type="button" class="btn btn-info buttons">
                    <p id="buttonText">Tweet out!</p>
                </button>
            </div>
            <!--End of button-->
            <!--Text box-->
            <div class="col-md-9">
                <span id="quotations"><em><i>"</i></em></span>
                <p id="quote"> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
                    dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
                <p class="pull-right"><span style="font-size: 20px">-</span> <i id="author"> George Washington</i></p>
            </div>
            <!--End of Text Box-->
        </div>
        <!--End of Container-->
        <!--Footer-->
        <footer>
            <p>Done By Nathaniel D Alcedo Jr</p>
        </footer>
        </div>
    </body>
    </html>

相关文章：