Jquery html“select”隐藏值大于指定值的选项

时间:2015-11-25 17:13:18

标签: javascript jquery html

我希望能够隐藏html“select”中的某些选项,其值大于特定变量:

这是我的html中的一个简单的“选择”,所有选项最初都可用:

<select class="form-control" id="results_per_page">
    <option value="4">4</option>
    <option value="8">8</option>
    <option value="12">12</option>
    <option value="16">16</option>
    <option value="20">20</option>
    <option value="28">28</option>
    <option value="40">40</option>
    <option value="80">80</option>
    <option value="120">120</option>
</select>

现在,我的脚本看起来像这样:

var itemsFound = "22"; //that's an example -can be any number

// I want to hide the options that are greater than "itemsFound"
$('#results_per_page').find('option[value > "'+itemsFound+'"]').hide();

上面的行返回“未捕获错误:语法错误,无法识别的表达式:选项[值&gt;”22“]

当我使用“相等”时,它起作用:

$('#results_per_page').find('option[value = "40"]').hide(); //the option with value "40" is indeed hidden

有关如何实施的任何想法?

1 个答案:

答案 0 :(得分:2)

您可以遍历每个项目并检查值:

&#13;
&#13;
{% set raw = project.raw | json_decode %} {{ raw.used_languages }}
&#13;
var itemsFound = "22"; //that's an example -can be any number
itemsFound = parseInt(itemsFound, 10);
//iterate through each option
$('#results_per_page option').each(function() {
  //better use parseInt to avoid unexpected bahavour
  currentItem = parseInt($(this).attr("value"), 10);
  //your condition
  if (currentItem > itemsFound) {
    $(this).hide();
  }

});
&#13;
&#13;
&#13;