对jQuery中显示的Spotify响应数量设置限制

Question

我在使用Spotify Search API构建一些东西。我现在所拥有的输入字段是每次有密钥时搜索Spotify数据库并显示最近的10个结果。

我一直在努力的事情是，我想限制结果的数量只有10个，但我明显得到了错误的地方，这意味着每次有一个关键起来，另外10个结果添加到结果列表中。

jQuery(document).ready(function($) { 

    var searchResult = null; 

    $('.spotify-input').each(function() { 

     var elem = $(this); 

     // Save current value of element 
     elem.data('oldVal', elem.val()); 

     // Look for changes in the value 
     elem.bind("propertychange keyup input paste", function(event) { 

      // If value has changed... 
      if (elem.data('oldVal') != elem.val()) { 

       // Updated stored value 
       elem.data('oldVal', elem.val()); 

       // Do action 
       query = $(this).val(); 
       $.ajax({ 
        url: 'http://ws.spotify.com/search/1/track.json', 
        dataType: 'json', 
        data: {q: query}, 
        timeout: 30000, 
        beforeSend: function (xhr) { 
         self._activeQueryXHR = xhr; 
        }, 
        complete: function (xhr, textStatus) { 
         if (self._activeQueryXHR === xhr) 
          self._activeQueryXHR = null; 
        }, 
        success: function (data, textStatus, xhr) { 
         console.log(data); 
         var searchResult = data; 

         i = 0; 
         $.each(data.tracks, function(index, track) { 

          //Set the limit for the number of responses 
          if(i < 11) { 
           //Track details 
           console.log(track.name); 
           $('<li class=\"spotify-result\">'+track.name+track.artists[0].name+'</li>').appendTo($('.dropdown-list')); 
          } 
          //For each result, add +1 to the counter 
          i++; 
         }) 
         //On-click Stuff 
         $('.spotify-result').click(function() { 
          $(this).clone().appendTo($('.selected-list')); 
         }); 
        } 
       }) 

      } 
     }); 

    }); 
}); 

我希望我已经解释了我需要的东西。我不是一个Javascript家伙，所以道歉，如果代码是穷人。

Answer 1

在这里，你需要清空.dropdown列表容器在每个成功的方法调用

$('.dropdown-list').empty(); 
$.each(data.tracks, function(index, track) { 

          //Set the limit for the number of responses 
          if(i < 11) { 
           //Track details 
           console.log(track.name); 
           $('<li class=\"spotify-result\">'+track.name+track.artists[0].name+'</li>').appendTo($('.dropdown-list')); 
          } 
          //For each result, add +1 to the counter 
          i++; 
         })