Açılır menüden geçiş yapma menüsü

Açılır menüde bir seçenek belirleyerek bir sınıfı değiştirmeye çalışıyorum, çalışıp çalışmadığını kontrol edip edemediğimi kontrol etmek için bir uyarı() kullanmayı denedim.Açılır menüden geçiş yapma menüsü

HTML:

<html> 
<body> 
    <select id="dropdown"> 
     <option value="1">Steinkjer</option> 
     <option value="2">Verdal</option> 
    </select> 
</body> 
</html>

JavaScript:

$('#dropdown option:selected').click(function(){ 
    var getText = $('#dropdown option').text(); 
    alert($('.overlay-'+getText)); 
});

bana bu sorunu çözmeye yardımcı olun.

kaynak

2015-06-12 Bin4ry

(" #dropdown seçeneği: seçili ") text(); – Bugfixer

olası seçenek [jQuery toggle div select seçeneğinden] (http://stackoverflow.com/questions/2767284/jquery-toggle-div-from-select-option) – Bugfixer

$('#dropdown option:selected') canlı bir nesne değildir. Kodunuz, sayfa yükleyicisinde tıklama işleyicisini seçili seçeneğe bağlar. Olay temsilcisini kullanmalı veya select öğesinin change olayını daha iyi dinlemelisiniz.

$('#dropdown').on('change', function() { 
    // Get text content of the selected option 
    var getText = $('option:selected', this).text(); 
    // Get current value of the select element 
    // var getValue = this.value; 
    console.log(getText); 
    console.log($('.overlay-'+getText)); 
});

kaynak

2015-06-12 08:01:03 undefined

Açılır menüyü tıklattığımda ve metni almam gerekiyorsa etiketinin içinde. Sadece yanıt olarak alıyorum: [Nesne nesnesi] – Bin4ry

@ Bin4ry Bunun nedeni bir jQuery nesnesini uyarıyor olmanızdır. Hata ayıklama için 'console.log' kullanmalısınız. Ayrıca metni günlüğe kaydetmek için 'getText' değişkenini jQuery nesnesine kaydetmeniz gerekir. Benim çek örneği – undefined

, bu i almak sınıfı değiştirir böylece bunu yapacak Nasıl –

Sen gerekir:

DOM öğeleri için bazı olayları bağlamak için değişim olayı atama

Kontrol document.ready yürütüldüğünde, bir belge gerektirir. için hazır, DOM öğesinin, olayını ilişkilendirdiğinizde oluşturulduğundan emin olun.

bir sayfalık bir belge kadar güvenle manipüle edilemez "hazır.": https://learn.jquery.com/using-jquery-core/document-ready/

Kontrol bu pasajı:

$(document).ready(function() { 
 

 
    $('#dropdown').change(function() { 
 
    var getText = $('#dropdown option:selected').html(); 
 
    $("#test").removeClass(); 
 
    $("#test").toggleClass("overlay-" + getText); 
 
    }); 
 

 

 

 
});

.overlay-Steinkjer { 
 
    background-color: red; 
 
} 
 
.overlay-Verdal { 
 
    background-color: green; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<html> 
 

 
<body> 
 
    <select id="dropdown"> 
 
    <option value="1">Steinkjer</option> 
 
    <option value="2">Verdal</option> 
 
    </select> 
 

 
    <p id="test">test paragraph</p> 
 
</body> 
 

 
</html>

kaynak

2015-06-12 08:06:23

çalışan doludur, bu denedim budur: $ (document) .ready (function() { $ ('# açılır') .change (function() { var getText = $ ('# dropdown seçeneği: seçili'). html(); $ ('. overlay -' + getText) .toggle(); }); }); – Bin4ry

$ ("# objID"). ToggleClass ("classname"); –

düzenlemeleri kontrol etmek için bir değişiklik yapmama izin verin! –

Açılır menüden geçiş yapma menüsü

cevap

İlgili konular