условно отображать радиокнопки на основе выбора окна выбора пользователя

-1

Ниже приведен пример кода - попытка отображения переключателей для отображения только тогда, когда пользователь выбирает конкретную опцию из окна выбора. См. Два комментария в тегах скрипта с указанием требований.условно отображать радиокнопки на основе выбора окна выбора пользователя

<!DOCTYPE HTML> 
<html> 
<head> 
    <style> 
    ul {list-style-type: none;} 
    </style> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script> 
    <script type="text/javascript"> 
     //what jQuery code is needed here so that the following occurs? 
     //1. the label for the radio buttons and the radio buttons themselves only appears when the user picks Formula Type 3 from the select box 
     //2. when the radio buttons and label are not displayed, the space they were in remains but it just looks empty (the word "placeholder", in the third li tag, does NOT move up underneath the select box) 
    </script> 
</head> 
<body> 
    <ul> 
     <li> 
      <label for="FormulaType">Formula Type</label> 
      <select name="FormulaType" id="FormulaType"> 
       <option value=""></option> 
       <option value="Type1">Type1</option> 
       <option value="Type2">Type2</option> 
       <option value="Type3">Type3</option> 
       <option value="Type4">Type4</option> 
      </select> 
     </li> 
     <li> 
      <label for="OutputFat">Output Fat Is</label> 
      <input type="radio" name="OutputFat" value="low">lowest 
      <input type="radio" name="OutputFat" value="high">highest  
      </radio> 
     </li> 
     <li> 
      placeholder 
     </li> 
    </ul> 
</body> 
</html>

источник

2013-08-30 knot22

Попробуйте

jQuery(function(){ 
    $('#FormulaType').change(function(){ 
     var $this = $(this); 
     $this.closest('li').next().css('visibility', $this.val() == 'Type3'? 'visible' : 'hidden') 
     //if don't want to preserve the space 
     //$this.closest('li').next().toggle($(this).val() == 'Type3') 
    }).triggerHandler('change') 
})

Демо: Fiddle

источник

2013-08-30 00:19:14

Второе требование не соблюдается, OP ищет для переключения видимости CSS, чтобы сохранить пустое пространство –

@koala_dev Я прочитал это другой способ ... использовать [видимость] (https://developer.mozilla.org/en-US/docs/Web/CSS/visibility) в этом случае –

Да, это неоднозначно, давайте посмотрим, разъясняет ли OP –

условно отображать радиокнопки на основе выбора окна выбора пользователя

ответ

Смежные вопросы