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

Question

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

<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 示例

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';
  }
}

此代码未经测试，但应该给您一个大致的概念。