선택 요소에서 선택한 옵션 가져 오기

드롭 다운에서 선택한 옵션을 가져오고 다음과 같이 해당 텍스트로 다른 항목을 채우려 고합니다. IE가 폭풍을 일으키고 있으며 Firefox에서 작동하지 않습니다.

$('#ddlCodes').change(function() {
  $('#txtEntry2').text('#ddlCodes option:selected').text();
});

내가 뭘 잘못하고 있죠?

다음은 짧은 버전입니다.

$('#ddlCodes').change(function() {
  $('#txtEntry2').text($(this).find(":selected").text());
});

karim79 는 잘 잡았습니다. 요소 이름으로 판단 txtEntry2하면 텍스트 상자가 될 수 있습니다. 어떤 종류의 입력이든 .val()대신 사용하거나 다음 .text()과 같이 사용해야 합니다.

  $('#txtEntry2').val($(this).find(":selected").text());

"무슨 일이야?" 질문의 일부 : .text()선택기를 사용하지 않거나 설정하려는 텍스트를 사용하거나 이미있는 텍스트를 반환하는 데 아무것도 사용하지 않습니다. 따라서 원하는 텍스트를 가져온 다음 .text(string)위와 같이 설정하려는 개체 의 메서드에 넣어야합니다 .

이 시도:

$('#ddlCodes').change(function() {
  var option = this.options[this.selectedIndex];
  $('#txtEntry2').text($(option).text());
});

다음은 작동해야하는 더 짧은 버전입니다.

 $('#ddlCodes').change(function() {
      $('#txtEntry2').text(this.val());
    });

더 적은 jQuery 사용 :

<select name="ddlCodes"
 onchange="$('#txtEntry2').text(this.options[this.selectedIndex].value);">

this.options[this.selectedIndex].value 일반 JavaScript입니다.

(출처 : German SelfHTML )

다음 코드를 시도하십시오

$('#ddlCodes').change(function() {
  $('#txtEntry2').val(  $('#ddlCodes :selected').text() );
});

선택한 요소의 수를 알고 싶다면

$("select option:selected").length

선택한 모든 요소의 값을 얻으려면

    var str = "";
  $("select option:selected").each(function () {
        str += $(this).text() + " ";
      });

이것은 나를 위해 일했습니다.

$("#SelectedCountryId_option_selected")[0].textContent

첫 번째 부분은 다음과 같은 드롭 다운 메뉴에서 요소를 가져 오는 것입니다.

<select id="cycles_list">
    <option value="10">10</option>
    <option value="100">100</option>
    <option value="1000">1000</option>
    <option value="10000">10000</option>
</select>

jQuery를 통해 캡처하려면 다음과 같이 할 수 있습니다.

$('#cycles_list').change(function() {
    var mylist = document.getElementById("cycles_list");
    iterations = mylist.options[mylist.selectedIndex].text;
});

변수에 값을 저장했으면 다음 단계는 변수에 저장된 정보를 선택한 양식 필드 또는 HTML 요소로 보내는 것입니다. div p 또는 맞춤 요소 일 수 있습니다.

즉 <p></p> OR <div></div>

다음을 사용합니다.

$ ( 'p'). html (반복); 또는 $ ( 'div'). html (반복);

다음과 같은 텍스트 필드를 채우려는 경우 :

<input type="text" name="textform" id="textform"></input>

다음을 사용합니다.

$ ( '# textform'). text = 반복;

물론 위의 모든 작업을 더 적은 단계로 수행 할 수 있습니다. 모든 것을 이해하기 쉬운 단계로 나누면 사람들이 배우는 데 도움이된다고 믿습니다. 도움이되기를 바랍니다.

selectedOptions 속성 (HTML5)을 사용하면 선택한 옵션을 얻을 수 있습니다.

document.getElementbyId("id").selectedOptions; 

이렇게하면 JQuery를 사용할 수 있습니다.

$("#id")[0].selectedOptions; 

또는

$("#id").prop("selectedOptions");

속성에는 선택한이 옵션과 유사한 HTMLCollection 배열이 포함되어 있습니다.

[<option value=​"1">​ABC</option>]

또는 여러 선택

[<option value=​"1">​ABC</option>, <option value=​"2">​DEF</option> ...]

위의 내용은 매우 잘 작동하지만 드롭 다운 텍스트에 대한 jQuery typecast를 놓친 것 같습니다. 그 외에는 .val()입력 텍스트 유형 요소에 대한 텍스트를 설정하는 데 사용 하는 것이 좋습니다 . 이러한 변경으로 코드는 다음과 같습니다.

    $('#txtEntry2').val($('#ddlCodes option:selected').text());

이미 이것을 가지고 있고 jquery를 사용한다면 이것이 당신의 대답이 될 것입니다.

$ ($ (this) [0] .selectedOptions [0]). text ()

이 HTML이 주어지면 :

<select>
    <option value="0">One</option>
    <option value="1">Two</option>
</select>

jQuery v1.6 +에 대한 설명으로 선택 :

var text1 = 'Two';
$("select option").filter(function() {
    //may want to use $.trim in here
    return $(this).text() == text1; 
}).prop('selected', true);