Bagaimana untuk mengikat acara perubahan pilih dalam jquery

Cara untuk mengikat acara perubahan pilih dengan jquery: 1. Buat fail sampel jQuery 2. Gunakan pemilih "$('select')" untuk memilih semua elemen pilih, dan kemudian ikat dengan "on(; )" peristiwa perubahan kaedah; 3. Selepas peristiwa berlaku, fungsi panggil balik menggunakan kaedah ".val()" dan ".find(':selected')" untuk mendapatkan nilai dan teks item yang dipilih; 4. konsol mengeluarkan kandungan yang dipilih, atau Paparkan sahaja pada halaman.

Sistem pengendalian untuk tutorial ini: Sistem Windows 10, versi jQuery 3.6.0, komputer Dell G3.

Menggunakan jQuery, anda hanya boleh mengikat acara perubahan untuk mendengar perubahan dalam elemen pilih.

Gunakan kod berikut untuk melaksanakan:

$(document).ready(function() {
  // 选择 select 元素，并绑定 change 事件
  $('select').on('change', function() {
    // 获取选中项的值和文本
    var selectedValue = $(this).val();
    var selectedText = $(this).find(':selected').text();
    
    // 在控制台输出选中项的值和文本
    console.log('选中了：' + selectedValue + '，' + selectedText);
    
    // 如果需要在页面上显示选中项的值或文本，可以使用以下代码
    // $('#result').text(selectedValue); 
    // $('#result').text(selectedText);
  });
});

Pemilih $('select') dalam kod di atas digunakan untuk memilih semua elemen pilih, dan kemudian kaedah on() mengikat peristiwa perubahan ke atas mereka. Fungsi panggil balik akan dicetuskan apabila pengguna memilih pilihan dalam elemen pilih.

Fungsi panggil balik mula-mula mendapatkan nilai dan teks item yang dipilih, di sini kaedah .val() dan .find(':selected') digunakan. Kandungan yang dipilih kemudiannya boleh dikeluarkan ke konsol atau dipaparkan pada halaman (dengan mengubah suai .text() elemen yang sepadan).

Jika anda ingin mengendalikan elemen pilih tertentu dalam halaman, pilih berdasarkan pemilih seperti ID atau nama kelasnya. Contohnya: $('#my-select') atau $('.my-select').

Atas ialah kandungan terperinci Bagaimana untuk mengikat acara perubahan pilih dalam jquery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!