Jquery kullanarak değişiklik olayını <select> tetikleyin

146

zaten sayfa yükleme seçim kutusunda bir değişiklik olayı tetikleyebilir ve belirli bir seçeneği seçebilirsiniz.

Ayrıca, işlevi olaya bağladıktan sonra tetikleyici eklenerek yürütülen işlev.

Ben böyle çıktı şeye çalışıyordu bu

<select class="check">
<option value="one">one</option>
<option value="two">two</option>
</select>

$(function(){
    $('.check').trigger('change'); //This event will fire the change event. 
    $('.check').change(function(){
      var data= $(this).val();
      alert(data);            
    });
});

http://jsfiddle.net/v7QWd/1/

jquery

— kishanio
kaynak

yükte belirli bir seçenek belirlemek istiyor musunuz? veya değişiklik etkinliğinizi tetiklemek mi istiyorsunuz?

— Manse

Son çözümü genişletebilir misiniz? Sayfa yüklendiğinde zorunlu bir seçeneğiniz mi yoksa belirli bir şey seçildiğinde farklı bir seçenek mi seçmeye çalışıyorsunuz?

— Matthew Riches

merhaba, geri bildiriminiz için teşekkürler sorunu çözmeyi başardım ve belgeledik.

— kishanio

289

Kullanım val()için değişime değeri (değil metin) ve trigger()elle olay yangın.

Değişiklik olay işleyicisi tetikleyiciden önce bildirilmelidir.

İşte bir örnek

$('.check').change(function(){
  var data= $(this).val();
  alert(data);            
});

$('.check')
    .val('two')
    .trigger('change');

— Joseph
kaynak

Ayrıca seçeneği değiştirdikten sonra change olay işlevini yürütmek istedim. wrt bu . uyarı kutusu yürütülmelidir.

— kishanio

@KishanThobhani işleyiciyi ekledikten sonra aramalısınız . örneğe bakın.

— Joseph

7

Bu çözümün önemli kısmı şudur: Değişiklik olay işleyicisi tetikten ÖNCE bildirilmelidir (mantıklıdır ...), benim durumumda sorun buydu, teşekkürler!

— Larzan

Kurtarıcı olarak yardımcı oldu, Teşekkürler @Joseph

— Divya

tanımlanmış değişiklik fonksiyonu kullanmadan ÖNCE, sorunumu çözdü. Teşekkürler.

— Kamlesh

28

Bir seçenek belirlemek .val('value-of-the-option')için select öğesinde kullanın . Değişiklik öğesini tetiklemek için .change()veya tuşunu kullanın .trigger('change').

Kodunuzdaki sorunlar nokta yerine virgül $('.check'),trigger('change');ve olay işleyiciyi bağlamadan önce onu çağırmanızdır.

— ThiefMaster
kaynak

10

$('#edit_user_details').find('select').trigger('change');

Bu değiştirecek seçme ile html etiketi açılır öğesini id="edit_user_details".

— Sohail xIN3N
kaynak

7

JQuery tetikleyici işleyicisi ile engellenenler için başka bir çalışma çözümü, yerel olaylarda dozaj ateşi aşağıdaki gibi olacaktır (% 100 çalışma):

var sortBySelect = document.querySelector("select.your-class"); 
sortBySelect.value = "new value"; 
sortBySelect.dispatchEvent(new Event("change"));

— Mohamed23gharbi
kaynak

1

Yukarıdakilerin hepsini denedim, ama sadece bu benim için çalışıyor. Sanırım seçimim kararın içindeydi. Teşekkürler @ Mohamed23gharbi!

— Tillito

1

Burada aynı. Bir saattir aradığım çözüm bu. Teşekkürler.

— mberna

1

Cevap bu olmalı!

— MARS

1

Seçenek etiketinin değerine bağlantılar verin

<select size="1" name="links" onchange="window.location.href=this.value;">
   <option value="http://www.google.com">Google</option>
   <option value="http://www.yahoo.com">Yahoo</option>
</select>

— Afraz Ahmed
kaynak

1

Bazı kontroller yapmak istiyorsanız, bu şekilde kullanın

 <select size="1" name="links" onchange="functionToTriggerClick(this.value)">
    <option value="">Select a Search Engine</option>        
    <option value="http://www.google.com">Google</option>
    <option value="http://www.yahoo.com">Yahoo</option>
</select>

<script>

   function functionToTriggerClick(link) {

     if(link != ''){
        window.location.href=link;
        }
    }  

</script>

— Afraz Ahmed
kaynak

0

Mohamed23gharbi'nin cevabına dayanarak:

function change(selector, value) {
    var sortBySelect = document.querySelector(selector);
    sortBySelect.value = value;
    sortBySelect.dispatchEvent(new Event("change"));
}

function click(selector) {
    var sortBySelect = document.querySelector(selector);
    sortBySelect.dispatchEvent(new Event("click"));
}

function test() {
    change("select#MySelect", 19);
    click("button#MyButton");
    click("a#MyLink");
}

Benim durumumda, öğelerin vue tarafından yaratıldığı yerde, bu işe yarayan tek yoldur.

— Tillito
kaynak

0

Sorununuzu çözmek için aşağıdaki kodu deneyebilirsiniz:

Varsayılan olarak, ilk seçenek şunu seçin: jQuery ('. Select'). Find ('seçenek') [0] .selected = true;

Teşekkürler, Ketan T

— Ketan Tambekar
kaynak