선택한 값에 대해 드롭 다운 목록을 표시하는 방법은 무엇입니까?

Question

나는 HTML 형식의 드롭 다운 목록이 있습니다. 사용자가이 옵션을 선택하면 선택에 따라 다른 드롭 다운 목록을 표시하려고합니다. 예를 들어

<select name="places"> 
    <option value="-1">Select</option> 
     <option value="nilgiris">Nilgiris </option> 
     <option value="coimbatore">Coimbatore</option> 
     <option value="chennai">Chennai</option> 
    </select> 

경우 사용자가 선택하는 'Nilgiris'내가 kotagiri 우티, 쿠 누르 같은 Nilgirs에서 장소를 보여 싶어 ...

<option value="ooty">Ooty </option> 
    <option value="coonoor">Coonoor</option> 
    <option value="kotagiri">Kotagiri</option> 

그것을 할 방법 ...

function check(elem) { 
    document.getElementById('places1').disabled = !elem.selectedIndex; 
    } 

<select name="places" onchange="check(this);"> 
     <option value="-1">Select</option> 
      <option value="nilgiris">Nilgiris </option> 
      <option value="coimbatore">Coimbatore</option> 
      <option value="chennai">Chennai</option> 
     </select> 


<select id="places1" disabled="disabled" > 
<option>Ooty</option> 
<option>Coonoor</option> 
<option>Kotagiri</option> 
</select> 

이 코드는 'places'드롭 다운 목록에서 'places'드롭 다운 목록을 활성화합니다 ...

나는 그것을 enabl로 만들고 싶습니다. e는 '장소'드롭 다운 목록에서 Nilgiris를 선택하기위한 것입니다.

만드는 방법 ???

Answer 1

선택 태그에는 'onselect'이벤트가 있습니다. 'onselect'요소에서 일부 텍스트를 선택한 후에 발생합니다. function onselect 이벤트를 호출 할 수 있습니다.

드롭 다운에서 바인딩 할 수있는 값에 따라 선택한 값이 함수에 적용됩니다.

Answer 2

<select name="places" id="dropdownlist" onchange="formulaTypeChange()"> 
    <option value="-1">Select</option> 
    <option value="nilgiris">Nilgiris</option> 
    <option value="coimbatore">Coimbatore</option> 
    <option value="chennai">Chennai</option> 
</select> 
<select id="nilgiris" style="display:none"> 
    <option value="ooty">Ooty</option> 
    <option value="coonoor">Coonoor</option> 
    <option value="kotagiri">Kotagiri</option> 
</select> 
<select id="coimbatore" style="display:none"> 
    <option value="mtp">MTP</option> 
    <option value="pollachi">Pollachi</option> 
    <option value="CBE">CBE</option> 
</select> 
<select id="chennai" style="display:none"> 
    <option value="perambur">Perambur</option> 
    <option value="guduvancheri">Guduvancheri</option> 
    <option value="mahabalipuram">Mahabalipuram</option> 
</select> 

4 개는 각각의 옵션 드롭 다운 목록.

function formulaTypeChange() { 
    if($("#dropdownlist").find('option:selected').val()== "nilgiris"){ 
     $('#nilgiris').css('display', 'block'); 
     $('#coimbatore').css('display', 'none'); 
     $('#chennai').css('display', 'none'); 
    } else if (str == 'coimbatore') { 
     $('#nilgiris').css('display', 'none'); 
     $('#coimbatore').css('display', 'block'); 
     $('#chennai').css('display', 'none'); 
    } else if (str == 'chennai') { 
     $('#nilgiris').css('display', 'none'); 
     $('#coimbatore').css('display', 'none'); 
     $('#chennai').css('display', 'block'); 
    } 
} 

#dropdownlist의 값에 따라 결과 드롭 다운 목록이 나타납니다. 희망이 도움이되었습니다.