HTML에서 선택한 옵션의 색인을 얻는 방법에 대해 약간 혼란 스럽습니다. <select>
항목 .
에 이 페이지에서 설명하는 두 가지 방법이있다. 그러나 둘 다 항상을 반환 -1
합니다. 내 jQuery 코드는 다음과 같습니다.
$(document).ready(function(){
$("#dropDownMenuKategorie").change(function(){
alert($("#dropDownMenuKategorie option:selected").index());
alert($("select[name='dropDownMenuKategorie'] option:selected").index());
});
});
그리고 html로
(...)
<select id="dropDownMenuKategorie">
<option value="gastronomie">Gastronomie</option>
<option value="finanzen">Finanzen</option>
<option value="lebensmittel">Lebensmittel</option>
<option value="gewerbe">Gewerbe</option>
<option value="shopping">Shopping</option>
<option value="bildung">Bildung</option>
</select>
(...)
왜 이런 행동? 방법 select
을 할당 할 때 “준비되지 않은” 가능성이 change()
있습니까? 또한 변화 .index()
하는 .val()
날 더 혼란 무엇 때문에 그의 오른쪽 값을 반환한다.
답변
첫 번째 방법은 테스트 한 브라우저에서 작동하는 것처럼 보이지만 옵션 태그가 실제로 모든 브라우저의 실제 요소와 일치하지 않으므로 결과가 다를 수 있습니다.
selectedIndex
DOM 요소 의 속성을 사용하십시오 .
alert($("#dropDownMenuKategorie")[0].selectedIndex);
최신 정보:
버전 1.6부터 jQuery에는 prop
속성을 읽는 데 사용할 수있는 방법이 있습니다.
alert($("#dropDownMenuKategorie").prop('selectedIndex'));
답변
Jquery 방식으로 이것을 해결하는 좋은 방법
$("#dropDownMenuKategorie option:selected").index()
답변
user167517의 답변에 따라 약간 다른 솔루션이 있습니다. 내 기능에서 타겟팅하려는 선택 상자의 ID에 변수를 사용하고 있습니다.
var vOptionSelect = "#productcodeSelect1";
색인은 다음과 함께 리턴됩니다.
$(vOptionSelect).find(":selected").index();
답변
이 .prop(propertyName)
함수를 사용 하여 jQuery 객체의 첫 번째 요소에서 속성을 가져올 수 있습니다 .
var savedIndex = $(selectElement).prop('selectedIndex');
이렇게하면 코드가 jQuery 영역 내에 유지되고 선택기를 사용하여 선택한 옵션을 찾는 다른 옵션도 피할 수 있습니다. 그런 다음 과부하를 사용하여 복원 할 수 있습니다.
$(selectElement).prop('selectedIndex', savedIndex);
답변
이 시도
alert(document.getElementById("dropDownMenuKategorie").selectedIndex);
답변
selectedIndex 는 JavaScript Select 속성입니다. jQuery의 경우 다음 코드를 사용할 수 있습니다.
jQuery(document).ready(function($) {
$("#dropDownMenuKategorie").change(function() {
// I personally prefer using console.log(), but if you want you can still go with the alert().
console.log($(this).children('option:selected').index());
});
});
답변
JQuery의 .prop () 메소드를 사용하여 선택 상자의 색인을 얻을 수 있습니다.
이것을 확인하십시오 :
<!doctype html>
<html>
<head>
<script type="text/javascript" src = "http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
});
function check(){
alert($("#NumberSelector").prop('selectedIndex'));
alert(document.getElementById("NumberSelector").value);
}
</script>
</head>
<body bgcolor="yellow">
<div>
<select id="NumberSelector" onchange="check()">
<option value="Its Zero">Zero</option>
<option value="Its One">One</option>
<option value="Its Two">Two</option>
<option value="Its Three">Three</option>
<option value="Its Four">Four</option>
<option value="Its Five">Five</option>
<option value="Its Six">Six</option>
<option value="Its Seven">Seven</option>
</select>
</div>
</body>
</html>