jQuery로 선택한 옵션의 인덱스 가져 오기 그러나 둘 다 항상을 반환 -1합니다.

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()날 더 혼란 무엇 때문에 그의 오른쪽 값을 반환한다.

답변

첫 번째 방법은 테스트 한 브라우저에서 작동하는 것처럼 보이지만 옵션 태그가 실제로 모든 브라우저의 실제 요소와 일치하지 않으므로 결과가 다를 수 있습니다.

selectedIndexDOM 요소 의 속성을 사용하십시오 .

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>