programing

jQuery를 사용하여 드롭다운 항목의 선택된 값 가져오기

iphone6s 2023. 6. 1. 22:32
반응형

jQuery를 사용하여 드롭다운 항목의 선택된 값 가져오기

jQuery를 사용하여 드롭다운 상자의 선택된 값을 가져오려면 어떻게 해야 합니까?
사용해 보았습니다.

var value = $('#dropDownId').val();

그리고.

var value = $('select#dropDownId option:selected').val();

둘 다 빈 문자열을 반환합니다.

단일 선택 돔 요소의 경우 현재 선택된 값을 가져오려면 다음을 수행합니다.

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

현재 선택한 텍스트를 가져오는 방법

$('#dropDownId :selected').text();

var value = $('#dropDownId:selected').text()

정상적으로 작동하는 경우 다음 예를 참조하십시오.

$(document).ready(function(){ 
  $('#button1').click(function(){ 
    alert($('#combo :selected').text());
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="combo">
  <option value="1">Test 1</option>
  <option value="2">Test 2</option>
</select>
<input id="button1" type="button" value="Click!" />

이 jQuery를 사용해 보십시오.

$("#ddlid option:selected").text();

아니면 이 자바스크립트,

 var selID=document.getElementById("ddlid");
 var text=selID.options[selID.selectedIndex].text;

텍스트가 아닌 값에 액세스해야 하는 경우 다음을 사용해 보십시오.val()대신 방법text().

아래 바이올린 링크를 확인하십시오.

데모1 | 데모2

이것을 먹어보세요.

$("#yourDropdown option:selected").text();

나는 이것이 매우 오래된 게시물이라는 것을 알고 있고 아마도 나는 이 불쌍한 부활에 대해 채찍질을 받아야 할 것이다, 하지만 나는 내가 내 무기에 있는 모든 애플리케이션에서 사용하는 매우 유용한 JS 스니펫 몇 개를 공유하고 싶다고 생각했습니다.

입력하는 경우:

$("#selector option:selected").val() // or
$("#selector option:selected").text()

나이가 들고 있습니다. 이 작은 크럼펫들을 당신의 글로벌에 추가해 보세요.*.js파일:

function soval(a) {
    return $('option:selected', a).val();
}
function sotext(a) {
    return $('option:selected', a).text();
}

그리고 그냥 써요.soval("#selector");또는sotext("#selector");대신에!두 가지를 결합하고 두 가지를 모두 포함하는 객체를 반환함으로써 더욱 화려해집니다.value그리고text!

function so(a) {
    my.value = $('option:selected', a).val();
    my.text  = $('option:selected', a).text();
    return my;
}

특히 폼을 많이 사용하는 애플리케이션에서 귀중한 시간을 많이 절약할 수 있습니다.

그러면 선택한 값에 경고가 표시됩니다.JQuery 코드...

$(document).ready(function () {

        $("#myDropDown").change(function (event) {
            alert("You have Selected  :: "+$(this).val());
        });
    });

HTML 코드...

<select id="myDropDown">
        <option>Milk</option>
        <option>Egg</option>
        <option>Bread</option>
        <option>Fruits</option>
    </select>

이것은 효과가 있을 것입니다.

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

또 다른 테스트된 예는 다음과 같습니다.

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
    $('#bonus').change(function() {
    alert($("#bonus option:selected").text());
  });  
});
</script>
</head>

<body>
<select id="bonus">
<option value="1">-$5000</option>
<option value="2">-$2500</option>
<option value="3">$0</option>
<option value="4">$1</option>
<option value="5">We really appreciate your work</option>
</select>
</body>
</html>

이것을 사용해 보면 다음과 같은 값을 얻을 수 있는 값은

$('select#myField').find('option:selected').val(); 

    function fundrp(){
    var text_value = $("#drpboxid option:selected").text();  
    console.log(text_value);
    var val_text = $("#drpboxid option:selected").val();  
    console.log(val_text);
    var value_text = $("#drpboxid option:selected").attr("value") ;
    console.log(value_text);
    var get_att_value = $("#drpboxid option:selected").attr("id") 
    console.log(get_att_value);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>
<select id="drpboxid">
    <option id="1_one" value="one">one</option>
    <option id="2_two" value="two">two</option>
    <option id="3_three" value="three">three</option>              
</select>
<button id="btndrp" onclick="fundrp()">Tracking Report1234</button>

선택 요소에 ID를 제공했습니까?

<select id='dropDownId'> ...

당신의 첫 번째 진술은 효과가 있을 것입니다!

사용하다

$('#dropDownId').find('option:selected').val()

이것은 효과가 있을 것입니다 :)

선택한 텍스트의 경우:

value: $('#dropDownId :selected').text();

선택한 값의 경우:

value: $('#dropDownId').val();

그id당신의 드롭다운 제어를 위해 생성된.html역동적인 것이 될 것입니다.그래서 완전한 id를 사용합니다.$('ct100_<Your control id>').val().그건 작동할 것이다.

오래된 것은 알지만 최신 답변으로 업데이트한 것 같습니다.

$( document ).on( 'change', '#combo', function () {
var prepMin= $("#combo option:selected").val();
 alert(prepMin);
});

이것이 도움이 되길 바랍니다.

아니면 당신이 시도한다면:

$("#foo").find("select[name=bar]").val();

저는 오늘 그것을 사용했고 잘 작동했습니다.

드롭다운에서 jquery 값을 얻으려면 방금 전송된 아래 함수를 사용합니다.id선택한 값을 가져옵니다.

function getValue(id){
    var value = "";
    if($('#'+id)[0]!=undefined && $('#'+id)[0]!=null){
        for(var i=0;i<$('#'+id)[0].length;i++){
            if($('#'+id)[0][i].selected == true){
                if(value != ""){
                    value = value + ", ";
                }
                value = value + $('#'+id)[0][i].innerText;
            }
        }
    }
    return value;
}

사용해 보십시오.

 $('#dropDownId option').filter(':selected').text();     

 $('#dropDownId option').filter(':selected').val();

다음 코드를 사용하여 이 작업을 수행할 수 있습니다.

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

선택 목록의 옵션에서 선택한 값을 가져오려는 경우.이 정도면 효과가 있을 겁니다.

$('#dropDownId option:selected').text();

$("select[id$=dropDownId]").val()
  • 이것을 먹어보세요.

다음 코드 중 하나를 사용합니다.

$('#dropDownId :selected').text();

OR

$('#dropDownId').text();

이것이 작동하는 방법입니다.

    var value= $('option:selected', $('#dropDownId')).val();

$("#selector <b>></b> option:selected").val()

또는

$("#selector <b>></b> option:selected").text()

위의 코드는 나에게 잘 작동했습니다.

다음 중 하나를 사용할 수 있습니다.

$(document).on('change', 'select#dropDownId', function(){

            var value = $('select#dropDownId option:selected').text();

            //OR

            var value = $(this).val();

});

이렇게 해야 돼요.

$('[id$=dropDownId] option:selected').val();

아래 방법을 사용하여 페이지 로드 시 선택한 값을 가져옵니다.

$(document).ready(function () {
$('#ddlid').on('change', function () {
                var value = $('#ddlid :selected').text();
                alert(value);`
            });
});

드롭다운 시도가 둘 이상 있는 경우:

HTML:

<select id="dropdown1" onchange="myFunction(this)">
    <option value='...'>Option1
    <option value='...'>Option2
</select>
<select id="dropdown2" onchange="myFunction(this)">
    <option value='...'>Option1
    <option value='...'>Option2
</select>

JavaScript:

    function myFunction(sel) {
        var selected = sel.value;
    }

HTML:

<select class="form-control" id="SecondSelect">
       <option>5<option>
       <option>10<option>
       <option>20<option>
       <option>30<option>
</select>

JavaScript:

var value = $('#SecondSelect')[0].value;

일반 페이지 로드 드롭다운의 경우

  $("#dropDownId").on('change',function(){
     var value=$(this).val();
     alert(value);
  });

동적으로 추가된 옵션의 경우 ID를 고유하게 유지해야 합니다.

  $(document).on('change','#dropDownId',function(){
    var value=$(this).val();
    alert(value)
  });

아래 코드 라인을 사용하여 드롭다운 목록 값을 얻을 수 있습니다. 이것은 작동할 것입니다.

vargetValue = document.getElementById("<%=ddlID).클라이언트 ID %>."."값;

언급URL : https://stackoverflow.com/questions/2780566/get-selected-value-of-a-dropdowns-item-using-jquery

반응형

'programing' 카테고리의 다른 글

VB/VB.NET 코드 주석 차단  (0) 2023.06.01
Html.Partial vs Html.부분 & Html을 렌더링합니다.액션 대 HTML.렌더 작업  (0) 2023.06.01
루비: 배열에서 첫 번째 요소를 제거하는 가장 쉬운 방법은 무엇입니까?  (0) 2023.06.01
mongodb에 인덱스가 있는지 확인하는 중  (0) 2023.06.01
iOS 애플리케이션에서 n분마다 백그라운드 위치 업데이트를 받으려면 어떻게 해야 합니까?  (0) 2023.06.01

'programing'의 다른글

  • 현재글jQuery를 사용하여 드롭다운 항목의 선택된 값 가져오기

관련글

댓글

티스토리툴바