Memicu perubahan acara drop-down

Saya ingin memicu peristiwa perubahan dropdown di $ (dokumen). Sudah menggunakan jquery.

Saya memiliki dropdown berjenjang untuk negara dan negara bagian di halaman detail pengguna. bagaimana cara mengatur nilai (yang diambil dari DB berdasarkan id pengguna) untuk negara dan negara bagian di MVC dengan C #.

Saya tidak tahu banyak JQuery tetapi saya pernah mendengarnya memungkinkan untuk mengaktifkan peristiwa asli dengan sintaks ini.

$(document).ready(function(){

    $('#countrylist').change(function(e){
       // Your event handler
    });

    // And now fire change event when the DOM is ready
    $('#countrylist').trigger('change');
});

Anda harus mendeklarasikan penangan peristiwa perubahan sebelum memanggil trigger () atau change () jika tidak maka tidak akan diaktifkan. Terima kasih telah menyebutkan @LenielMacaferi.

Informasi lebih lanjut di sini .

Coba ini:

$(document).ready(function(event) {
    $('#countrylist').change(function(e){
         // put code here
     }).change();
});

Tentukan peristiwa perubahan, dan segera picu. Ini memastikan event handler didefinisikan sebelum memanggilnya.

Mungkin terlambat untuk menjawab poster asli, tetapi orang lain mungkin mendapat manfaat dari notasi singkatan, dan ini mengikuti rangkaian jQuery, dll.

jquery chaining

Coba ini:

$('#id').change();

Bekerja untuk saya.

Pada satu baris bersama dengan pengaturan nilai: $('#id').val(16).change();

Jika Anda mencoba untuk menghubungkan drop-down, cara terbaik untuk melakukannya adalah memiliki skrip yang mengembalikan kotak pilih prebuilt dan panggilan AJAX yang memintanya.

Berikut adalah dokumentasi untuk metode Ajax jQuery jika Anda membutuhkannya.

$(document).ready(function(){

    $('#countrylist').change(function(e){
        $this = $(e.target);
        $.ajax({
            type: "POST",
            url: "scriptname.asp", // Don't know asp/asp.net at all so you will have to do this bit
            data: { country: $this.val() },
            success:function(data){
                $('#stateBoxHook').html(data);
            }
        });
    });

});

Kemudian buat rentang di sekitar kotak pilih negara bagian Anda dengan id "stateBoxHook"

sebagai alternatif Anda dapat meletakkan atribut onchange pada daftar dropdown itu sendiri, bahwa onchange akan memanggil fungsi jquery tertentu seperti ini.

<input type="dropdownlist" onchange="jqueryFunc()">

<script type="text/javascript">
$(function(){
    jqueryFunc(){
        //something goes here
    }
});
</script>

harap yang ini membantu Anda, dan harap perhatikan bahwa kode ini hanyalah draf kasar, tidak diuji pada ide apa pun. Terima kasih

Untuk beberapa alasan, jQuerysolusi lain yang disediakan di sini berfungsi saat menjalankan skrip dari konsol, namun tidak berfungsi untuk saya saat dipicu dari Chrome Bookmarklets .

Untungnya, solusi Vanilla JS ini ( triggerChangeEventfungsi) berhasil:

/**
  * Trigger a `change` event on given drop down option element.
  * WARNING: only works if not already selected.
  * @see /programming/902212/trigger-change-event-of-dropdown/58579258#58579258
  */
function triggerChangeEvent(option) {
  // set selected property
  option.selected = true;
  
  // raise event on parent <select> element
  if ("createEvent" in document) {
    var evt = document.createEvent("HTMLEvents");
    evt.initEvent("change", false, true);
    option.parentNode.dispatchEvent(evt);
  }
  else {
    option.parentNode.fireEvent("onchange");
  }
}

// ################################################
// Setup our test case
// ################################################

(function setup() {
  const sel = document.querySelector('#fruit');
  sel.onchange = () => {
    document.querySelector('#result').textContent = sel.value;
  };
})();

function runTest() {
  const sel = document.querySelector('#selector').value;
  const optionEl = document.querySelector(sel);
  triggerChangeEvent(optionEl);
}

<select id="fruit">
  <option value="">(select a fruit)</option>
  <option value="apple">Apple</option>
  <option value="banana">Banana</option>
  <option value="pineapple">Pineapple</option>
</select>

<p>
  You have selected: <b id="result"></b>
</p>
<p>
  <input id="selector" placeholder="selector" value="option[value='banana']">
  <button onclick="runTest()">Trigger select!</button>
</p>