使用slice()仅返回前5个结果

杰米克斯304

目前,我有一个网站,单击该按钮可返回最新的电影和正在播放的电视节目。

现在,我正在使用的api返回的整页值最多是我对api的研究得出的20个结果,没有限制函数,我要做的就是将其中5个结果返回

有人告诉我slice()函数可能起作用。

还有其他为什么您认为我的工作也会很好的原因,如果您能想出另一种方法

我已经包含一个jsfiddle但删除了我的api密钥

jsfiddle- http://jsfiddle.net/xvTe9/

这是我所有的代码,没有我的api密钥

<html>
<head>
<title>Sample Seach</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    var url = 'http://api.themoviedb.org/3/',
    mode = 'movie/now_playing',
    input,
    movieName,
    key = '?api_key=API KEY HERE';

    $('#search').click(function() {
        var input = $('#titlesearch').val(),
            movieName = encodeURI(input);
        $.ajax({
            url: url + mode + key + '&query='+movieName' ,
            dataType: 'jsonp',
            success: function(data) {

        var table = '<table>';
        $.each( data.results, function( key, value ) {
          table += '<tr><td class="results-img"><img src="http://image.tmdb.org/t/p/w500' + value.poster_path +'" alt="" width="130" height="150"></td><td class="results-title"><h4>' + value.original_title + '</h4></td></tr>';
        });
        $('#searchresult').html(table);
            }
        });
    });
});
// tv show search
$(document).ready(function() {
    var url = 'http://api.themoviedb.org/3/',
    mode = 'tv/on_the_air',
    input,
    tvName,
    key = '?api_key=API KEY HERE';

    $('#search').click(function() {
        var input = $('#titlesearch').val(),
            tvName = encodeURI(input);
        $.ajax({
            url: url + mode + key + '&query='+tvName,
            dataType: 'jsonp',
            success: function(data) {

        var table = '<table>';
        $.each( data.results, function( key, value ) {
          table += '<tr><td class="results-img"><img src="http://image.tmdb.org/t/p/w500' + value.poster_path +'" alt="" width="130" height="150"></td><td class="results-title"><h4>' + value.original_name + '</h4></td></tr>';
        });
        $('#searchresulttv').html(table);
            }
        });
    });
});
</script>
<script text="text/javascript">
// When the more button is click this runs a search using the title of the movie it is next to  
$('.results-img').live('click', '.results-img', function() {
    getImdbInfo( $(this).closest('tr').find('.results-title').text());
});

//The function below takes the entered title and searchs imdb for a match then it displays as followed

function getImdbInfo(Title) {
    var url = "http://www.omdbapi.com/?t=" + Title + "&plot=full";
    $.ajax({
      url: url,
      cache: false,
      dataType: "jsonp",
      success: function(data) {

            var str = "";
            str += "<h2><center>Title :" +data.Title+ "</center></h2>";
            str += "<center><img src='" + data.Poster + "' /></center><br />";
            str += "<h4><center>Plot :</center></h4><p>" +data.Plot+ "</p>";

            $("#chosenresult").html(str);
      },
      error: function (request, status, error) { alert(status + ", " + error); }
    });
}

</script>
</head>
<body>
<center>
<h1>Movie and Tv Search</h1>
<button id="search">Search</button>
</center>
<div id="chosenresult"></div>
<div id="searchresult" style="float:left;"></div>
<div id="searchresulttv" style="float:right;"></div>
</body>
</html>

我只需要5个结果的屏幕截图

在此处输入图片说明

vivek_nk

首先使用slice减少必须在ajax的回调函数中进行迭代的数组。

var results = data.results.slice(0,5);
$.each(results, function( key, value ) {
          table += '<tr><td class="results-img"><img src="http://image.tmdb.org/t/p/w500' + value.poster_path +'" alt="" width="130" height="150"></td><td class="results-title"><h4>' + value.original_name + '</h4></td></tr>';
});

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章