선택옵션
본문
선택옵션을 조금 변경해서 사용중인데
버튼을 따로 만들고 버튼 클릭했을때 같은 선택옵션의 option을 select 하고 sel_option_process(true); 해서 같은 값이 선택되게 하고 있어요
이게 선택옵션이 한개일때는 잘 되는데 선택옵션이 2개 이상일때는 안되더라고요
$("#it_option_1 option:eq("+indexNo+")").prop("selected", true); 로 option 을 선택해서 하는데
선택옵션이 2개 이상일때는
$(document).on("change", "select.it_option", function() {}
shop.js 에 이 이벤트를 타고 선택옵션을 보여주는걸로 보이는데
$("#it_option_1 option:eq("+indexNo+")").prop("selected", true); 이걸 했을때는
$(document).on("change", "select.it_option", function() {} 이 이벤트가 실행하지 않더라고요
혹시 $(document).on("change", "select.it_option", function() {} 이 이벤트를 js 로 실행시키는 방법이 있을까요?
답변 3
답변 부탁드립니다.
그렇습니다. 같은 선택옵션의 option을 select 하고 sel_option_process(true); 하는 것은 가능합니다. 다음과 같이 작성하시면 됩니다. $("#it_option_1 option:eq("+indexNo+")").prop("selected", true); // 선택옵션 1 선택 $("#it_option_2 option:eq("+indexNo+")").prop("selected", true); // 선택옵션 2 선택 sel_option_process(true); // 선택옵션 처리
아래의 기능을 원하시나요? 아이디 my_1 만 바꿔서 두고두고 우려 먹음 됩니다.
<button type="button" onclick="my_1.value=innerText">가을</button>
<select id="my_1" name="my_1">
<option>선택</option>
<option>봄</option>
<option>여름</option>
<option>가을</option>
<option>겨울</option>
</select>
<br>
<button type="button" onclick="my_2.value=innerText">여름</button>
<select id="my_2" name="my_2">
<option>선택</option>
<option>봄</option>
<option>여름</option>
<option>가을</option>
<option>겨울</option>
</select>
<br>
<button type="button" onclick="my_3.value=innerText">겨울</button>
<select id="my_3" name="my_3">
<option>선택</option>
<option>봄</option>
<option>여름</option>
<option>가을</option>
<option>겨울</option>
</select>
$("#it_option_1 option:eq("+indexNo+")").prop("selected", true); 이걸 했을때는
==> id값으로 선택된 요소에 이벤트 핸들러 지정한 것이고
$(document).on("change", "select.it_option", function() {} 이 이벤트가 실행하지 않더라고요
==> class로 선택한 요소에 지정한 것입니다.
