jQuery는 특정 옵션 태그 텍스트를 얻습니다.

좋아, 내가 이것을 가지고 있다고 말하십시오.

<select id='list'>
    <option value='1'>Option A</option>
    <option value='2'>Option B</option>
    <option value='3'>Option C</option>
</select>

값이 '2'인 경우 "옵션 B"를 얻으려면 선택기가 어떻게 표시됩니까?

이것은 선택된 텍스트 값 을 얻는 방법을 묻는 것이 아니라 value 속성에 따라 선택 여부에 관계없이 그중 하나만 선택 한다는 점에 유의하십시오 . 나는 시도했다 :

$("#list[value='2']").text();

그러나 작동하지 않습니다.

이 ID를 가진 요소에 대해 찾고 list속성을 가지고 value같음 2.
당신이 원하는 것은 인 option의 자녀 list:

$("#list option[value='2']").text()

값이 2 인 옵션을 얻으려면

$("#list option[value='2']").text();

현재 선택된 옵션을 얻으려면

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

이것은 나를 위해 완벽하게 작동했으며 MySQL에서 생성 된 옵션으로 두 가지 다른 값을 보내는 방법을 찾고 있었고 다음은 일반적이며 역동적입니다.

$(this).find("option:selected").text();

의견 중 하나에서 언급했듯이. 이를 통해 옵션 값과 텍스트 값을 모두 얻으려는 모든 선택 상자에서 작동하는 동적 함수를 만들 수있었습니다.

며칠 전 나는 jQuery를 사이트의 1.6에서 1.9로 업데이트 할 때이 코드를 사용했는데 작동이 멈췄을 것입니다 ... 아마도 다른 코드와 충돌했을 것입니다 ... 어쨌든, 해결책은 옵션에서 옵션을 제거하는 것이 었습니다 find () 호출 :

$(this).find(":selected").text();

그게 내 해결책이었습니다 ... jQuery를 업데이트 한 후 문제가있는 경우에만 사용하십시오.

Paolo가 게시 한 원본 HTML을 기반으로 다음을 생각해 냈습니다.

$("#list").change(function() {
    alert($(this).find("option:selected").text()+' clicked!');
});

Internet Explorer 및 Firefox에서 작동하도록 테스트되었습니다.

$("#list option:selected").each(function() {
   alert($(this).text());
});  

#list요소 에서 여러 선택된 값에 대해 .

1. 페이지에 select 태그가 하나만 있으면 id 'list'내부에서 select를 지정할 수 있습니다.

   jQuery("select option[value=2]").text();

2. 선택된 텍스트를 얻으려면

   jQuery("select option:selected").text();

다음을 시도하십시오 :

$("#list option[value=2]").text();

당신 때문에 원래 조각이 작동하지 않는 이유는 OPTION태그가 당신에 자녀 SELECT이 태그는, id list.

이것은 오래된 질문이므로 언젠가 업데이트되지 않았으므로 올바른 방법은 지금 사용하는 것입니다.

$("#action").on('change',function() {
    alert($(this).find("option:selected").text()+' clicked!');
});

이게 도움이 되길 바란다 :-)

선택한 라벨을 가져오고 싶었습니다. 이것은 jQuery 1.5.1에서 나를 위해 일했습니다.

$("#list :selected").text();

$(this).children(":selected").text()

$("#list [value='2']").text();

id 선택기 뒤에 공백을 두십시오.

기능을 사용하여 선택한 옵션 텍스트를 얻을 수 있습니다 .text();

다음과 같이 함수를 호출 할 수 있습니다.

jQuery("select option:selected").text();

.each와 동적으로 생성 된 선택 요소를 통해 "루핑"동안 (함수 () ...) $("option:selected").text();와 $(this + " option:selected").text()선택된 옵션의 텍스트를 반환하지 않았습니다 - 대신은 null입니다.

그러나 Peter Mortensen의 솔루션은 다음과 같이 작동했습니다.

$(this).find("option:selected").text();

나는 왜 일반적인 방법이 .each()(아마도 내 자신의 실수) 에서 성공하지 못했는지는 모르지만, 피터, 감사합니다. 나는 그것이 원래의 질문이 아니라는 것을 알고 있지만 "Google을 통해 오는 초보자들에게"라고 언급하고 있습니다.

$('#list option:selected").each()select 요소에서 물건을 가져와야한다는 것을 제외하고 는 시작 했을 것입니다.

사용하다:

function selected_state(){
    jQuery("#list option").each(function(){
        if(jQuery(this).val() == "2"){
            jQuery(this).attr("selected","selected");
            return false;
        }
    });
}

jQuery(document).ready(function(){
    selected_state();
});

ID 대신 내부 필드 이름으로 val을 찾고 있었고 Google 에서이 게시물로 도움이되었지만 필요한 솔루션을 찾지 못했지만 솔루션을 얻었으며 여기에 있습니다.

따라서 누군가 SharePoint 목록에 긴 ID를 사용하는 대신 필드 내부 이름으로 선택된 값을 찾는 데 도움이 될 수 있습니다.

var e = $('select[title="IntenalFieldName"] option:selected').text(); 

동적으로 캐스팅 된 객체를 처리 할 때이 답변이 필요했으며 다른 방법은 작동하지 않는 것 같습니다.

element.options[element.selectedIndex].text

물론 이것은 HTML을 nodeValue, childNodes 등으로 파싱하는 대신 DOM 객체를 사용합니다 .

팁 : 값이 동적 인 경우 아래 코드를 사용할 수 있습니다.

$("#list option[value='"+aDynamicValue+"']").text();

또는 (더 나은 스타일)

$("#list option").filter(function() {
     return this.value === aDynamicValue;
}).text();

jQuery 에서 언급했듯이 특정 옵션 태그 텍스트를 가져 와서 동적 변수를 값에 배치하십시오.

대안 솔루션 으로 jQuery 선택기 의 컨텍스트 부분을 사용 하여 드롭 다운 목록 내부에서 <option>요소 를 찾을 수도 있습니다 value="2".

$("option[value='2']", "#list").text();

나는 오른쪽에 선택된 것을 표시하는 다중 선택을위한 동적 버전을 원했습니다 ( $(this).find앞서 읽었고 보았던 것) :

<script type="text/javascript">
    $(document).ready(function(){
        $("select[showChoices]").each(function(){
            $(this).after("<span id='spn"+$(this).attr('id')+"' style='border:1px solid black;width:100px;float:left;white-space:nowrap;'>&nbsp;</span>");
            doShowSelected($(this).attr('id'));//shows initial selections
        }).change(function(){
            doShowSelected($(this).attr('id'));//as user makes new selections
        });
    });
    function doShowSelected(inId){
        var aryVals=$("#"+inId).val();
        var selText="";
        for(var i=0; i<aryVals.length; i++){
            var o="#"+inId+" option[value='"+aryVals[i]+"']";
            selText+=$(o).text()+"<br>";
        }
        $("#spn"+inId).html(selText);
    }
</script>
<select style="float:left;" multiple="true" id="mySelect" name="mySelect" showChoices="true">
    <option selected="selected" value=1>opt 1</option>
    <option selected="selected" value=2>opt 2</option>
    <option value=3>opt 3</option>
    <option value=4>opt 4</option>
</select>

다음 방법 중 하나를 얻을 수 있습니다

$("#list").find('option').filter('[value=2]').text()

$("#list").find('option[value=2]').text()

$("#list").children('option[value=2]').text()

$("#list option[value='2']").text()

$(function(){    
    
    console.log($("#list").find('option').filter('[value=2]').text());
    console.log($("#list").find('option[value=2]').text());
    console.log($("#list").children('option[value=2]').text());
    console.log($("#list option[value='2']").text());
    
});

<script src="//ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<select id='list'>
    <option value='1'>Option A</option>
    <option value='2'>Option B</option>
    <option value='3'>Option C</option>
</select>