从jQuery .change上具有相同类的不同复选框中获取唯一字段

Grabbing unique field from different checkboxes with same class on jQuery .change

本文关键字：复选框 获取 字段 唯一 同类 change jQuery      更新时间：2023-09-26

为了提高效率，我正在尝试设计一个jQuery函数，该函数可由共享公共类的不同复选框使用。 当用户更改其中一个复选框时，该函数由 .change 事件触发。 诀窍是，我需要捕获更改的复选框的唯一数据。

我的网页：

Field 123: <input type="checkbox" name="pubfield" value="123" class="pubfield"><br>
Field 999: <input type="checkbox" name="pubfield" value="999" class="pubfield"><br>

我的jQuery函数：

$(function(){
    $( ".pubfield" ).change(function() {
        var change_field    = $('.pubfield').val();
        var showit          = $('input.pubfield').prop('checked'); /* true or false */
        alert('Updating field ' + change_field + ' to '  + showit);
    }); 
});

可以预见的是，该函数仅捕获第一个复选框字段的输入值和复选框状态，即使第二个复选框字段发生更改也是如此。 如何重复使用相同的功能，同时仅从正在更改的复选框中捕获唯一数据？

尝试：

$(function(){
   $( ".pubfield" ).change(function() {
       var change_field    = $(this).val();
       var showit          = $(this).prop('checked'); /* true or false */
       alert('Updating field ' + change_field + ' to '  + showit);
   }); 
});

元素 $(this) 表示触发事件的元素...

您必须

在事件处理程序中使用this，而不是再次调用选择器：

$(function(){
    $( ".pubfield" ).change(function() {
        var change_field    = $(this).val();
        var showit          = $(this).prop('checked'); /* true or false */
        alert('Updating field ' + change_field + ' to '  + showit);
    }); 
});
相关文章：