Question

我不确定如何使其工作，以便从getrandomvideos获取变量并在jquery语句中使用它。我希望用户按下一个按钮，然后随机选择一个名称，然后提交给jquery语句，然后格式化返回的JSON。

<!doctype html>
<html>
    <head>
        <title>Trove Basic Search</title>
        <meta charset="utf-8">
        <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
    </head>

    <body>

        <h2>Search Trove</h2>

        <button type="submit" id="searchbtn">Search</button>

        <hr />

        <div id="output">
            <h4>Search Results</h4>
        </div>

        <script type="text/javascript">

            function getRandomVideo() {
                        var searches = [
                            'beethoven',
                            'mozart',
                            'beethoven',
                            'debussy',
                        ]
                        var rand = Math.floor(Math.random()*videos.length);

                        var search = searches[rand]; 

                        return search
                    }            

            var apiKey = "jja10ssv4950uh65";
            var searchTerm = getRandomVideo();

            $(document).ready(function(){

                // There is an issue with TROVE applications where the first search will result in nothing being returned
                // To get around this, we perform a dummy submit. Not sure how to do this
                $("#searchbtn").submit

                $("#searchbtn").submit(function() {

                    var url = "http://api.trove.nla.gov.au/result?key=" + apiKey + "&encoding=json&zone=newspaper&sortby=relevance&q=" + searchTerm + "&s=0&n=5&include=articletext,pdf&encoding=json&callback=?";

                    console.log(url);

                    $.getJSON(url, function(data) {

                        $('#output').empty();

                        $.each(data.response.zone[0].records.article, function(index, value) {
                            $("#output").append("<p>" + value.articleText +"</p>");
                        });
                    });
                });
            });
        </script>
    </body>
</html>

Answer 1

在当前实现中，您将在页面加载时获取名称，并且每次都会使用该名称。每次用户点击时都要更改。

将该行替换为：

var url = "http://api.trove.nla.gov.au/result?key=" + apiKey + "&encoding=json&zone=newspaper&sortby=relevance&q=" + searchTerm + "&s=0&n=5&include=articletext,pdf&encoding=json&callback=?";

每次调用此视频时都会获得一个新视频

var searchTerm = getRandomVideo();
var url = "http://api.trove.nla.gov.au/result?key=" + apiKey + "&encoding=json&zone=newspaper&sortby=relevance&q=" + searchTerm + "&s=0&n=5&include=articletext,pdf&encoding=json&callback=?";

Answer 2

试试这段代码：

var url = "http://api.trove.nla.gov.au/result?key=" + apiKey + "&encoding=json&zone=newspaper&sortby=relevance&q=" + searchTerm + "&s=0&n=5&include=articletext,pdf&encoding=json&callback=?";

Answer 3

如果您只是将函数放入就绪函数中可能会更好，并且只需使用单击函数作为提交按钮：

$(document).ready(function(){

   function getRandomVideo() {
     var searches = [
                        'beethoven',
                        'mozart',
                        'beethoven',
                        'debussy',
                    ];
     // this should be searches.length
     // var rand = Math.floor(Math.random()*videos.length);
     var rand = Math.floor(Math.random() * searches.length);
     var search = searches[rand]; 
     return search
   } 

     var apiKey = "jja10ssv4950uh65"; 
     // just use click event
     $("#searchbtn").click(function(e) {
        // we disable default behavior of button
        e,preventDefault();
        // here we call the function every time submit button clicked
        var searchTerm = getRandomVideo();
        var url = "http://api.trove.nla.gov.au/result?key=" + apiKey + "&encoding=json&zone=newspaper&sortby=relevance&q=" + searchTerm + "&s=0&n=5&include=articletext,pdf&encoding=json&callback=?";
        console.log(url);
        $.getJSON(url, function(data) {
             $('#output').empty();
                  $.each(data.response.zone[0].records.article, function(index, value) {
                        $("#output").append("<p>" + value.articleText +"</p>");
                    });
                });
            });
        });

函数中的变量用于jquery

3 个答案: