Question

如何隐藏只有1个选项的下拉列表项？下面，我想隐藏第一和第三，但无法弄清楚这一点。有人可以帮忙吗？

<li>
  <label>Test 1</label>
  <select>
    <option selected="selected" value="0">Select</option>
  </select>
</li>
<li>
  <label>Test 2</label>
  <select>
    <option selected="selected" value="0">Select</option>
    <option selected="selected" value="1">Option 1</option>
  </select>
</li>
<li>
  <label>Test 3</label>
  <select>
    <option selected="selected" value="0">Select</option>
  </select>
</li>

Answer 1

试试这个：

$('select').filter(function() {
    return $(this).find('option').length === 1; 
}).closest('li').hide();

Answer 2

这是快速的一个衬垫，不使用每个或过滤器：

$('select').not(':has(option:eq(1))').parent().remove();

<强> jsFiddle example

Answer 3

你可以强制它，只需循环所有选择框并检查每个选项中有多少选项，如果没有足够的话，将其隐藏。

var selectBoxes = document.getElementsByTagName('select');
var length = selectBoxes.length;
var i = 0;

for (; i < length; i++) {
  if (selectBoxes[i].options.length < 2) {
    selectBoxes[i].parentNode.style.display = 'none';
  }
}

此代码未经测试，但应该为您提供一般概念。

隐藏只有1个选项的下拉菜单？

3 个答案: