如何在 DDL 中隐藏/显示项目

how to hideshow items in ddl

本文关键字：显示 项目 隐藏 DDL      更新时间：2023-09-26

我有一个ddl控件。我想更改客户端 （JS） 上某些项目的可见性。我只找到了插入''删除项目的方法。但我只想隐藏''展示它们。

有人知道如何做到这一点吗？

您需要访问该项目并将其 [edit]style.display[/edit] 设置为"none"：

<html>
  <head>
    <script type="text/javascript">
      function hideItem() {
         document.getElementById("a3").style.display = "none";
      }
    </script>
    <body onload="hideItem()">
       <form>
          <select name="ddl" size="1">
            <option id="a1">Option 1</option>
            <option id="a2">Option 2</option>
            <option id="a3">Option 3</option>
            <option id="a4">Option 4</option>
            <option id="a5">Option 5</option>
          </select>
       </form>
   </body>
</html>

我想你正在寻找 

    <span style="display:none">

选择。您可以使用Javascript切换此样式。

在 Firefox 中，您可以使用display样式：

<select id="s" name="ddl" size="1">
    <option id="a1">Option 1</option>
    <option id="a2">Option 2</option>
    <option id="a3">Option 3</option>
    <option id="a4">Option 4</option>
    <option id="a5">Option 5</option>
</select>

和：

document.getElementById("a3").style.display = "none";

但是，这在Internet Explorer上不起作用。对于 IE，您只能完全删除该元素（以后可能会重新添加它）：

document.getElementById("s").options[2] = null;
如果要将元素

存储在某个位置以便以后重新添加，则可以将元素移动到单独的隐藏<select />。

您唯一能做的就是删除该选项。

你可以简单地在jQuery中做到这一点：

$('#yourOptionId').remove();

或者，您可以通过以下方式禁用该选项：

$('#yourOptionId').attr('disabled', 'disabled');

并通过以下方式启用：

$('#yourOptionId').removeAttr("disabled");

但是不，没有办法简单地隐藏一个选项。

通过"ddl 控制"，我假设结构如下：

<select id="selectId">
    <option id="optionId"></option>
</select>
相关文章：