jQuery가 선택한 옵션 값을 가져옵니다(텍스트가 아니라 'value' 속성).

jQuery가 선택한 옵션 값을 가져옵니다(텍스트가 아니라 'value' 속성).

좋아요, 코드가 있어요

<select name="selector" id="selector">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
</select>

그리고 옵션의 값을 선택하고 싶습니다.예: 'Option 2'가 선택되어 있고 그 값은 '2'입니다.'2'는 내가 얻어야 할 값이지 '옵션 2'가 아닙니다.

2020년 04월: 수정된 구답

선택한 옵션에서 :selected pseudo selector를 사용한 다음 .val 함수를 사용하여 옵션의 값을 가져옵니다.

$('select[name=selector] option').filter(':selected').val()

사이드 노트:필터를 사용하는 것이 사용하는 것보다 낫습니다.:selected첫번째 쿼리에서 직접 selector를 선택합니다.

변경 처리기 안에 있으면 간단히 사용할 수 있습니다.this.value선택한 옵션 값을 가져옵니다.자세한 옵션은 데모를 참조하십시오.

//ways to retrieve selected option and text outside handler
console.log('Selected option value ' + $('select option').filter(':selected').val()); 
console.log('Selected option value ' + $('select option').filter(':selected').text());

$('select').on('change', function () {
  //ways to retrieve selected option and text outside handler
  console.log('Changed option value ' + this.value);
  console.log('Changed option text ' + $(this).find('option').filter(':selected').text());
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<select>
  <option value="1" selected>1 - Text</option>
  <option value="2">2 - Text</option>
  <option value="3">3 - Text</option>
  <option value="4">4 - Text</option>
</select>

이전 답변:

편집: 많은 분들이 지적하신 것처럼 선택한 옵션 값은 반환되지 않습니다.

~~ .val을 사용하여 선택한 옵션의 값을 가져옵니다.아래 참조,

$('select[name=selector]').val()~~

저는 제 경험을 공유하고 싶었을 뿐입니다.

나를 위해.

$('#selectorId').val()

null을 반환했습니다.

나는 사용해야만 했습니다.

$('#selectorId option:selected').val()

$('select').change(function() {
    console.log($(this).val())
});​

jsFiddle 예제

.val()가치를 얻을 것입니다.

선택한 항목에 ID를 추가해야 합니다.그러면:
$('#selectorID').val()

시도해 보기:

$(document).ready(function(){
    var data= $('select').find('option:selected').val();
});

아니면

var data= $('select').find('option:selected').text();

사용가능jquery하기와 같이

대본

  $('#IDOfyourdropdown').change(function(){
    alert($(this).val());
  });

FIDDLE이 왔습니다.

이와 같은 선택의 경우

<select class="btn btn-info pull-right" id="list-name" style="width: auto;">
   <option id="0">CHOOSE AN OPTION</option>
   <option id="127">John Doe</option>
   <option id="129" selected>Jane Doe</option>

... 이런 식으로 ID를 얻을 수 있습니다.

$('#list-name option:selected').attr('id');

아니면 가치를 이용해서 쉽게 이용할 수도 있습니다.

<select class="btn btn-info pull-right" id="list-name" style="width: auto;">
   <option value="0">CHOOSE AN OPTION</option>
   <option value="127">John Doe</option>
   <option value="129" selected>Jane Doe</option>

다음과 같이:

$('#list-name').val();

옵션 중 하나에 값이 없었습니다.<option>-----</option>. 저는 사용하려고 했습니다.if (!$(this).val()) { .. }이상한 결과가 나왔습니다만약 당신이 그들에게value당신의 탓으로 돌림.<option>element는 빈 문자열 대신 내부 텍스트를 반환합니다.원하지 않으시면val()옵션에 대해 무엇이든 반환하려면 다음을 추가해야 합니다.value="".

 $(document ).ready(function() {
    $('select[name=selectorname]').change(function() { 
     alert($(this).val());});
 });

이 코드는 나에게 매우 잘 작동합니다. 이것은 선택된 옵션의 값을 반환합니다.$('#select_id').(' 찾기 옵션:selected').val ();

소스 링크

jQueryval()을 사용하여 GET Selected Value를, text()를 GET Option Text를 사용합니다.

    <select id="myDropDown" class="form-control">
        <option value="0">Select Value 0</option>
        <option value="8">Option value 8</option>
        <option value="5">Option value 5</option>
        <option value="4">Option value 4</option>
    </select>

선택 드롭다운에서 이벤트 변경

        $("#myDropDown").change(function () {

            // Fetching Value
            console.log($(this).val());

            // Fetching Text
            console.log($(this).find('option:selected').text());

            alert('Value: '+$(this).val()+' | Text: '+$(this).find('option:selected').text());
        });

버튼 클릭

        $("button").click(function () {

        // Fetching Value
            console.log($("#myDropDown").val());

    // Fetching Text
            console.log($('#myDropDown option:selected').text());

            alert('Value: '+$("#myDropDown").val()+' | Text: '+$('#myDropDown option:selected').text());
        });

$('#myOptions').change(function() {
  var value = $("#myOptions option:selected").val();
  alert(value);
});

<select name="selector" id="myOptions">
  <option value="1">Option 1</option>
  <option value="2">Option 2</option>
</select>

이 예를 보십시오.

    <select class="element select small" id="account_name" name="account_name"> 

        <option value="" selected="selected">Please Select</option>           
        <option value="paypal" >Paypal</option>
        <option value="webmoney" >Webmoney</option>

    </select>

 <script type="text/javascript">

        $(document).ready(function(){ 
             $('#account_name').change(function(){
               alert($(this).val());                                                          
             });
        });
 </script>

$('#selectorID').val();

오어

$('select[name=selector]').val();

오어

$('.class_nam').val();

더 잘 되고 있어요.먹어봐.

let value = $("select#yourId option").filter(":selected").val();

언급URL : https://stackoverflow.com/questions/13089944/jquery-get-selected-option-value-not-the-text-but-the-attribute-value