ํ”„๋กœ์ ํŠธ ๊ธฐ๋ก

select๋ฌธ ํ…Œ์ŠคํŠธ์šฉ ์†Œ์Šค

์ฝ”๋”ฉํ•˜๋Š” ๋ถ•์–ด 2021. 2. 15. 02:49
๋ฐ˜์‘ํ˜•
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
    <script>
    $(function() {
        $("select#sel1").on("change", function() {
        	$("select#sel2 option").remove();
        	if($(this).val()==1){
        		$("select#sel2").append("<option value='๊ฐœ1'>๊ฐœ1</option>");
        		$("select#sel2").append("<option value='๊ฐœ2'>๊ฐœ2</option>");
        		$("select#sel2").append("<option value='๊ฐœ3'>๊ฐœ3</option>");    		
        	}else if($(this).val()==2){
        		$("select#sel2").append("<option value='๊ณ ์–‘์ด1'>๊ณ ์–‘์ด1</option>");
        		$("select#sel2").append("<option value='๊ณ ์–‘์ด2'>๊ณ ์–‘์ด2</option>");
        		$("select#sel2").append("<option value='๊ณ ์–‘์ด3'>๊ณ ์–‘์ด3</option>");
        	}

        });

    });

    </script>
</head>
<body>
<a href="#">ํด๋ฆญ</a>
<div>
   <select id="sel1">
      <option value="1">one</option>
      <option value="2">two</option>
      <option value="3">three</option>
   </select>
</div>
<div>
   <select id="sel2">
   </select>
</div>
</body>
</html>

 

๋ฐ˜์‘ํ˜•
์ €์ž‘์žํ‘œ์‹œ (์ƒˆ์ฐฝ์—ด๋ฆผ)