jQuery On <select> Thay đổi tổ chức sự kiện Không Firing

Question

Tôi đã sau trong tiêu đề:

$('body').on('change', '#userFilter', function(){ 
    console.log('changed'); 
}); 

Và yếu tố này là tự động chèn vào trang khi tab được nhấp:

<select id="userFilter"> 
    <option value="1">1</option> 
    <option value="2">2</option> 
    <option value="3">3</option> 
</select> 

Vấn đề là khi tôi thay đổi trình đơn thả xuống, không có gì được hiển thị trong bảng điều khiển.

Answer 1

Wrap nó trong $(document).ready(function(){....}) để kiểm soát html userFilter được thêm vào DOM và có sẵn để javascript

$(document).ready({ 
    $('body').on('change', '#userFilter', function(){ 
     console.log('changed'); 
    }); 
}); 

Việc xử lý thông qua để sẵn sàng() được đảm bảo để được thực thi sau khi DOM đã sẵn sàng , vì vậy đây thường là nơi tốt nhất để đính kèm tất cả các trình xử lý sự kiện khác và chạy mã jQuery khác, jQuery docs.

Answer 2

Mặc dù một chút không liên quan đến OQ, nếu bạn đến đây vì lựa chọn của bạn không kích hoạt, hãy đảm bảo rằng trước đó bạn không chọn "Ngăn trang này hiển thị ..." alert(). Bạn sẽ cần phải đóng tab và mở lại URL đó để làm điều đó kích hoạt lại một cách rõ ràng.