Belirli öğeden seçilen seçeneği alın

Bir açılır menüden seçilen seçeneği almaya ve bu metinle aşağıdaki gibi başka bir öğeyi doldurmaya çalışıyorum. IE bir fırtına havlıyor ve Firefox'ta çalışmıyor:

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

Neyi yanlış yapıyorum?

İşte kısa bir versiyon:

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

karim79 iyi bir yakalama yaptı, eleman adınıza txtEntry2göre bir metin kutusu olabilir, eğer herhangi bir girdiyse, .val()bunun yerine veya bunun .text()gibi kullanmanız gerekecek :

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

"Sorun ne?" İçin sorunun bir parçası: .text()bir seçici almıyor, ayarlanmasını istediğiniz metni alıyor veya zaten oradaki metni döndürmek için hiçbir şey yok. Bu yüzden, istediğiniz metni getirmeniz, ardından .text(string)yukarıda yaptığım gibi ayarlamak istediğiniz nesnenin yöntemine koymanız gerekir .

Bunu dene:

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

İşte çalışması gereken daha kısa bir versiyon:

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

Daha az jQuery ile:

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

this.options[this.selectedIndex].value düz JavaScript.

(Kaynak: German SelfHTML )

Aşağıdaki kodu deneyin

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

Seçilen elemanların sayısını bilmek için şunu kullanın:

$("select option:selected").length

Seçilen tüm öğelerin değerini almak için şunu kullanın:

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

Bu benim için çalıştı:

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

İlk bölüm, aşağıdaki gibi görünebilen açılır menüden öğeyi almaktır:

<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 ile yakalamak için aşağıdaki gibi bir şey yapabilirsiniz:

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

Değeri değişkeninize kaydettikten sonraki adım, değişkende depolanan bilgileri seçtiğiniz form alanına veya HTML öğesine göndermek olacaktır. Bir div p veya özel bir öğe olabilir.

yani <p></p> OR <div></div>

Kullanacaksın:

$ ('p']. html (yinelemeler); VEYA $ ('div']. Html (yinelemeler);

Aşağıdaki gibi bir metin alanını doldurmak isterseniz:

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

Kullanacaksın:

$ ['# textform']. text = yinelemeler;

Elbette yukarıdakilerin hepsini daha az adımda yapabilirsiniz, ben sadece hepsini anlaşılması kolay adımlara böldüğünüzde insanların öğrenmesine yardımcı olduğuna inanıyorum ... Umarım bu yardımcı olur!

SelectedOptions özelliğini (HTML5) kullanarak, seçilen seçenekleri elde edebilirsiniz.

document.getElementbyId("id").selectedOptions; 

JQuery ile bunu yaparak elde edilebilir

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

veya

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

Özellik, bu seçili seçeneğe benzer bir HTMLCollection dizisi içerir

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

veya çoklu seçim

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

Yukarıdakiler çok iyi çalışacaktır, ancak açılan metin için jQuery typecast'i kaçırmışsınız gibi görünüyor. Bunun dışında, .val()bir giriş metin türü öğesi için metin ayarlamak için kullanılması tavsiye edilir . Bu değişikliklerle birlikte kod aşağıdaki gibi görünecektir:

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

Eğer zaten buna sahipseniz ve jquery kullanıyorsanız, cevabınız bu olacaktır:

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

Bu HTML verildiğinde:

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

JQuery v1.6 + için açıklamaya göre seçin:

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