Question

我正在处理一个水平列表，该列表显示了数组的最后12个项目。

我要做的是调整要显示的范围。

例如数组长度为50，默认情况下将显示最后12个项目（39-50）。因此，如果单击 LEFT 按钮，下一项将是26-38。与右键相同。

我尝试实现答案here，但没有运气。

希望你能帮助我。

谢谢。

var arrResults = [40, 100, 1, 5, 25, 10, 12, 32, 41, 51, 15, 13, 11, 55, 62, 64, 75, 77, 33, 1, 5, 25, 10, 12, 32, 41, 51, 15, 13, 11, 55, 62, 64, 75, 77, 33];
var len = arrResults.length;
var lastTwelve = arrResults.slice(Math.max(arrResults.length - 12));
lastTwelve.reverse();
for (var i = 0; i < lastTwelve.length; i++) {
   $('ul').prepend('<li><p>'+ len +'</p><p>'+ lastTwelve[i] +'</p></li>');
            len--;
        }

$('.left').click(function(){
    
});

ul li{
  list-style-type: none;
  width: 30px;
  float: left;
  background-color: #DDD;
  border: 1px solid #FFF;
  text-align: center;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  
</ul>

<button class="left">LEFT</button>
<br>
<button class="left">RIGHT</button>

Answer 1

类似的东西：

var k = 1;
displayData(k);
function displayData(k){

var arrResults = [40, 100, 1, 5, 25, 10, 12, 32, 41, 51, 15, 13, 11, 55, 62, 64, 75, 77, 33, 1, 5, 25, 10, 12, 32, 41, 51, 15, 13, 11, 55, 62, 64, 75, 77, 33];
var len = arrResults.length;
$('.ulclass').empty();
var temp=len-(k-1)*12;
for (var i =(len-(k-1)*12) ; i >(len-12*k) ; i--) {
   $('ul').prepend('<li><p>'+ temp +'</p><p>'+ arrResults[i-1] +'</p></li>');
         temp-- ;
        }
}
$('.left').click(function(){
    k = k+1;
    displayData(k);
});

$('.right').click(function(){
  k = k-1;
  displayData(k);
});

ul li{
  list-style-type: none;
  width: 30px;
  float: left;
  background-color: #DDD;
  border: 1px solid #FFF;
  text-align: center;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <ul class="ulclass">
      
    </ul>
    
    <button class="left">LEFT</button>
    <br>

    <button class="right">RIGHT</button>

请检查一下您是否超出范围，因为我没有实现它。

我希望能提供帮助。

更改范围位置以从数组显示

1 个答案: