jQuery : 특정 <select> 옵션이 선택된 경우 div 표시?

Question

장바구니의 주소 페이지에서 작업하고 있습니다. 2 개의 <select> 상자가 있습니다. 하나는 국가 용, 하나는 지역 용입니다.

표준 국가는 6 개가 있으며, 그렇지 않으면 사용자는 "기타 국가"를 선택해야합니다. <option> 요소에는 모두 숫자 값이 있습니다. - 기타 국가는 241입니다. 사용자가 다른 국가를 선택하고 또한 텍스트 영역을 표시하면 <select> 영역을 숨길 수 있습니다.

도움이 많이 감사합니다!

Answer 1

함수를 선택 목록에 바인딩하여 함수가 변경 될 때 함수가 div를 표시할지 결정해야합니다. 이 같은 것 ( 테스트되지 않음, 아마도 구문 상 닫기). 여기에 live example입니다.

$(document).ready(function() { 
    $('#YourSelectList').bind('change', function (e) { 
    if($('#YourSelectList').val() == 241) { 
     $('#OtherDiv').show(); 
    } 
    else{ 
     $('#OtherDiv').hide(); 
    }   
    }); 
}); 

Answer 2

this question과 같은 원리입니다. 선택 항목의 변경 사항에 연결하기 만하면 val() 및 hide()/show() div를 확인하십시오.

Answer 3

제 의견으로는 jQuery가 필요하지 않습니다.

이 간단한 자바 스크립트 코드는 트릭을 할 것입니다 : 대부분의 브라우저에 대한

document.getElementById('country_id').onchange = function() 
{ 
    if (this.options[this.selectedIndex].value == 241) { 
     document.getElementById('region_id').style.display = 'block'; 
    } else { 
     document.getElementById('region_id').style.display = 'none'; 
    } 
} 

value 일을하지만, 예, 이전 버전의 브라우저를 위해 당신은 select.options[select.selectedIndex].value이 필요합니다. 스크립트를 업데이트했습니다.