Rumah >masalah biasa >Bagaimana untuk mengikat acara perubahan pilih dalam jquery

Bagaimana untuk mengikat acara perubahan pilih dalam jquery

尊渡假赌尊渡假赌尊渡假赌
尊渡假赌尊渡假赌尊渡假赌asal
2023-06-09 16:02:073367semak imbas

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.

Bagaimana untuk mengikat acara perubahan pilih dalam jquery

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!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn