jquery 如何使用表复选框选择所有功能的2表在单页

8wtpewkr 于 12个月前发布在 jQuery

关注(0)|答案(1)|浏览(113)

实际上，在这个表中，select all和column-wise选择使用class和id完美地工作，如何在一个页面上重新配置多个表而不重复js代码？寻求建议。

$(document).ready(function() {
  // Check all rows
  $('#check_all').click(function() {
    $('input').prop('checked', this.checked);
  });

  // Check all columns
  $('.check_column').click(function() {
    var index = $(this).closest('th').index();
    var isChecked = $(this).prop('checked');
    $('.check_row').each(function() {
      var checkboxes = $(this).closest('tr').find(':checkbox');
      checkboxes.eq(index).prop('checked', isChecked);
    });
  });

  $('.check_row').click(function() {
    var checkboxes = $(this).closest('tr').find(':checkbox');
    checkboxes.prop('checked', this.checked);
  });
});

个字符

jquery

来源：https://stackoverflow.com/questions/77725914/how-to-use-table-checkbox-select-all-functionality-for-2-table-in-single-page

1条答案

按热度按时间

7xllpg7q1#

你必须去掉表中所有的id s，只使用class es。

$(document).ready(function() {
    // Check all rows
    $('.check_all').click(function () {
        $(this).closest('table')
            .find('input[type="checkbox"]')
            .prop('checked', $(this).prop('checked'));
    });

    // Check all columns
    $('.check_column').click(function () {
        var column = $(this).closest('th').index() + 1;

        $(this).closest('table')
            .find('tbody > tr > td:nth-child(' + column + ')')
            .find('input[type="checkbox"]')
            .prop('checked', $(this).prop('checked'));
    });

    // Check all rows
    $('.check_row').click(function() {
        $(this).closest('tr')
            .find('input[type="checkbox"]')
            .prop('checked', $(this).prop('checked'));
    });
});

个字符

赞(0）回复(0）举报 12个月前

我来回答

jquery 如何使用表复选框选择所有功能的2表在单页

1条答案

相关问题

热门标签

最新问答