как скрыть \ показать элементы в ddl - PullRequest
Новая
       3

как скрыть \ показать элементы в ddl

1 голос
/ 24 мая 2011

У меня есть контроль над dll. Я хочу изменить видимость некоторых элементов на стороне клиента (JS). Я нашел только методы для вставки \ удаления предметов. Но я хочу только скрыть \ показать их.

У кого-нибудь есть идеи, как это сделать?

Ответы [ 4 ]

0 голосов
/ 24 мая 2011

В 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 /> если вы хотите сохранить его где-нибудь для последующего добавления.

0 голосов
/ 24 мая 2011

Единственное, что вы можете сделать, это удалить опцию.

Вы можете сделать это просто в jQuery: 

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

Или вы можете отключить опцию: 

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

И включить с помощью: 

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

Но нет способа просто скрыть опцию.

Под "контролем ddl" я предполагаю, что структура будет похожа: 

<select id="selectId">
    <option id="optionId"></option>
</select>
0 голосов
/ 24 мая 2011

Вам необходимо получить доступ к элементу и установить для него [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>
0 голосов
/ 24 мая 2011

Я думаю, что вы ищете 

    <span style="display:none">

опция. Вы можете переключать этот стиль, используя Javascript.

...