jquery로 동적으로 생성 된 옵션을 어떻게 선택합니까?
jquery로 동적 드롭 다운 메뉴를 만들었습니다. 옵션은 "데이터"배열로 채워집니다.
옵션을 만든 후 쿼리로 특정 옵션을 선택하려고합니다. 내 예에서는 'opt2'.
이 예에서는 모든 것이 잘 작동합니다. 그러나 내 응용 프로그램에서는 항상 첫 번째 옵션이 선택됩니다. alert()전에 $("select").val('opt2');만든 경우에만 올바른 옵션이 선택됩니다.
동적으로 만들어진 선택 옵션이 선택하려고 할 때 준비되지 않았기 때문이라고 생각합니다.
const data = ['opt1', 'opt2', 'opt3'];
for (let i = 0; i < data.length; i++) {
console.log(data[i]);
$('#maschAusw').append($("<option>").attr('value', data[i]).text(data[i]));
}
$("select").val('opt2');<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="maschAusw">
<option selected disabled value="">Choose...</option>
</select>첫째, <select>페이지에 여러 요소가있는 경우 선택기가 이상적이지 않습니다 . 을 사용하는 것이 좋습니다 #maschAusw.
selected속성 을 지정해야 합니다. 다음과 같이 할 수 있습니다.
$("#maschAusw").children('option[value="opt2"]').prop('selected', true);
또한 selected현재 선택한 옵션에서 속성을 제거해야 합니다. 다음과 같이 수행 할 수 있습니다.
$("#maschAusw").children('option[value="opt2"]')
.prop('selected', true)
.siblings()
.prop('selected', false);
아래의 작업 예를 참조하십시오.
const data = ['opt1', 'opt2', 'opt3'];
for (let i = 0; i < data.length; i++) {
console.log(data[i]);
$('#maschAusw').append($("<option>").attr('value', data[i]).text(data[i]));
}
$("#maschAusw").children('option[value="opt2"]')
.prop('selected', true)
.siblings()
.prop('selected', false);<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="maschAusw">
<option selected disabled value="">Choose...</option>
</select>이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다