如何使用 JavaScript 使 <select> 的 <option> 显示或隐藏？答案

【问题标题】：How to make <option>s of <select> show or hide using JavaScript?如何使用 JavaScript 使 <select> 的 <option> 显示或隐藏？
【发布时间】：2011-04-17 04:44:05
【问题描述】：

我想通过程序（JS）使

就像StackOverFlow首页的有趣标签一样，当你输入一些单词时，下拉列表会展开并给你建议。

ps.我知道StackOverFlow在这种情况下没有使用select，反正就拿它来说吧。

【问题讨论】：

使用输入文本框，用户至少输入 2 个字符时使用 ajax，然后将结果输出为列表 (ul)，其格式类似于使用 CSS 的下拉菜单。
是的，谢谢，这也是我认为最好的解决方案，我也注意到StackOverFlow使用这种方法而不是我上面提到的情况下的
查看此隐藏/显示选项：stackoverflow.com/a/21199399/32429

标签： javascript html html-select

【解决方案1】：

function getCatListdef(sel)
{
    var index = ajax.length;
    ajax[index] = new sack();
     ajax[index].requestFile = 'data.php?cat_code='+sel;
     ajax[index].onCompletion = function(){ createCities(index) };  
    ajax[index].runAJAX();    
}

【讨论】：

这个答案有什么帮助？ ajax 是什么？ sack 是什么？

【解决方案2】：

您从select 的options 集合中添加或删除项目。

这是一个删除一个项目并添加另一个项目的示例：

<html>
<head>
<title></title>
<script type="text/javascript">

function init() {
  // get a reference to the element
  var sel = document.getElementById('sel');
  // remove an option
  sel.options[2] = null;
  // create a new option and add to the select
  var opt = document.createElement('option');
  opt.value = '5';
  opt.text = 'five';
  sel.options.add(opt);
}

</script>
</head>
<body onload="init();">
<form>

<select id="sel">
  <option value="0">zero</option>
  <option value="1">one</option>
  <option value="2">two</option>
  <option value="3">three</option>
  <option value="4">four</option>
</select>

</form>
</body>
</html>

【讨论】：

看来你没有明白我的意思，无论如何，谢谢你的回复。
@DiveInto：在那种情况下，我仍然没有。你在说什么，是什么？