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

【问题标题】：a possible solution of jquery based dropdown?基于 jquery 的下拉菜单的可能解决方案？
【发布时间】：2010-07-23 22:36:36
【问题描述】：

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

  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");

我怎样才能在那里显示最后选择的一个。谢谢

【问题讨论】：

标签： jquery jquery-selectors

【解决方案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'); 
}

You can give it a try here，这简化了循环的整体完成方式。我仍然不能 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>

【讨论】：

尼克当我用你的代码替换我的代码时，它会显示下拉菜单，但没有选项/值。它只是一个空的下拉菜单。谢谢
@user295189 - 您可以将周围的代码发布到您当前的问题吗？您可以从示例中看到这种方法有效，但您的整个页面中肯定有其他东西在起作用，我们只需要弄清楚它是什么。
嗨尼克，我的其他代码运行良好。唯一的问题是它添加了两次。就像第一次显示完美这个但是如果我在第二次运行中再次选择上述任何选项，它将下拉选项中的选项复制到此 100-150选项> 1-50选项> 51-100选项> 100-150选项> 第三次以此类推。
有什么方法可以检查选项是否存在然后不附加它？谢谢
我在想可能会检查是否已经有多个选项不运行这部分 $('#startRecord').append( $('').val(i).html((j+1)+'-'+(j+=50)));因为很可能它已经在那里了

【解决方案2】：

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

【讨论】：