处理具有不同 ID 和功能的多个复选框

Question

将所有 checkboxes 放在一个事件中的最佳方法是什么？

示例是下面的代码，我有 20 个（来自 #tcbx1- #tcbx20）。

function tblcheckboxes(){
    var a=0;
    if ($('#tcbx1').is(":checked")) {
         a = parseFloat($("#tcbx1").val(), 10);
    }

$(document).ready(function(){
        $('#tcbx1').click(function(){
            tblcheckboxes();
            grandtotal();
        });
});

还有另一个具有不同 id 和不同 $(document).ready(function(){ 的复选框（来自 #cbx3- #cbx5）

function grandtotal(){
    var g=0;
    if ($('#cbx3').is(":checked")) {
        g = parseFloat($("#cbx3").val(), 10);
        }

$(document).ready(function(){   
    $('#cbx3').click(function(){
        grandtotal();
});

第一个 checkbox 组合在一个 table 中，其他 checkbox 只是一些附加组件。

Answer 1

查看 starts-with selector [id^="tcbx"] 到 select id 以 "tcbx" 开头的所有元素。

function tblcheckboxes(cb){
    var a=0;
    if (cb.is(":checked")) {
        a = parseFloat(cb.val(), 10);
    }
}

$(document).ready(function(){
    $('[id^="tcbx"]').click(function(){
        var cb = $(this);
        tblcheckboxes(cb);
        grandtotal(cb);
    });
});

...以及 select 以 "cbx":

开头的项目

function grandtotal(cb){
    var g=0;
    if (cb.is(":checked")) {
        g = parseFloat(cb.val(), 10);
    }
}

$(document).ready(function(){   
    $('[id^=cbx]').click(function(){
        var cb = $(this);
        grandtotal(cb);
});

处理具有不同 ID 和功能的多个复选框

Handling multiple checkboxes that have different id and functions

html

checkbox

jquery