基于jquery的下拉菜单的可能解决方案？

Question

我正在通过 jquery 附加函数在一个完全独立的页面上生成一个下拉列表。如果我只使用附加，我会得到重复的数据行

  if(params.totalRecords > 50){
         var i, j;
    j = 0;              
    for(i=0; i < params.totalRecords; i++){                 
    if(i%50==0){
    $('#startRecord').append( 
    $('<option></option>').val(i).html((j+1)+'-'+(j+=50)));          
    }
  }             
    $('#dropDownSpan').css('visibility', 'visible'); 
}  

，所以现在当我添加要下拉的值时，它会添加重复的行，具体

<option value=0>1-50</option>
<option value=50>51-100</option>
<option value=0>1-50</option>

取决于我选择的选项，它只会使其重复。

现在为了避免这种情况，我做了以下操作

  if(params.totalRecords > 50){
    $('#startRecord').val(0).html("1-50");
    var i, j;
    j = 0;              
    for(i=0; i < params.totalRecords; i++){                 
    if(i%50==0){
    $('#startRecord').append( 
    $('<option></option>').val(i).html((j+1)+'-'+(j+=50)));          
    }
  }             
    $('#dropDownSpan').css('visibility', 'visible'); 
}    

现在的问题是它总是将其保留为 1-50 条记录，因为

$('#startRecord').val(0).html("1-50");

我怎样才能在那里显示最后选定的一条记录。 谢谢

Answer 1

我将在这里建议一种非常不同的、希望更简单的循环方法：

if(params.totalRecords > 50){
  for(var i=0; i < params.totalRecords; i+=50) {
    $('<option></option>', { value: i, html: (i+1)+'-'+Math.min(i+50, params.totalRecords) })
      .appendTo('#startRecord');
  }             
  $('#dropDownSpan').css('visibility', 'visible'); 
} 

您可以在这里尝试一下，这简化了循环的整体完成方式。我仍然不能 100% 确定您如何获得额外的附加行，您确定您当前的代码不会以不同的 totalRecords 计数被调用两次吗？

关于上面的一个旁注，它的输出略有不同，例如 121 条记录而不是“101-150”，它会将“101-121”作为最后一项，这更准确一点，我希望这就是您的意思之后，整体输出如下所示：

<select id="startRecord">
  <option value="0">1-50</option>
  <option value="50">51-100</option>
  <option value="100">101-121</option>
</select>

Answer 2

使用这个 var i, j=0, y=0 解决了这个问题； //检查我们有多少个 50 的块。每 50 条记录 1 条。最后一个块不必拥有全部 50 for(r=0; r