在 JavaScript 的按钮单击事件中打印与 HTML 中的复选框关联的值

Question

计划从 HTML 页面上的选择中获取特定的 ID 值（此处的选择表示选中的框）。这是我的按钮单击事件代码（按钮将获取行号或 ID）：

$("a", button).click(function () {
            $('#groups').find('tr').each(function () {
                 var row = $(this);
                 if (row.find('input[type="checkbox"]').is(':checked')) {
                    console.log($(this));
            }
        });
});

这个 returns 关于行 + tr 标签的附加信息，但是，我只想要它的 ID 部分。这是我从上面的代码中得到的示例输出：

[tr#row-12150.row.oddSelected, context: tr#row-12150.row.oddSelected]
[tr#row-12151.row.evenSelected, context: tr#row-12151.row.evenSelected]

这意味着我从 #groups table 中选择了 12150 and 12151。我如何只提取行号 12150 and 12151 而不是整个详细输出，我希望它存储在一个数组/（JS 数组）中用于多个行号。

Answer 1

您的行符合 .find('tr')，您应该可以：

console.log($(this).attr('id')); //this should show the id in your console.

因此您的代码变为：

$("a", button).click(function () {
            $('#groups').find('tr').each(function () {
                 var row = $(this);
                 if (row.find('input[type="checkbox"]').is(':checked')) {
                   console.log($(this).attr('id'));
            }
        });
});

然后只获取您可以使用的号码：

var number = $(this).attr(id).split('-')[1] //assuming it's always row-<<some number>>

综合起来：

 $("a", button).click(function () {
                $('#groups').find('tr').each(function () {
                     var row = $(this);
                     if (row.find('input[type="checkbox"]').is(':checked')) {
                       var number = $(this).attr('id').split('-')[1] //assuming it's always row-<<some number>>;
                       console.log(number);
                }
            });
    });

将其存储在数组中：

$("a", button).click(function () {
                    var checkedRows = []; //define empty array.
                    var count = 0; //keep a counter to use for the array.
                    $('#groups').find('tr').each(function () {
                         var row = $(this);
                         if (row.find('input[type="checkbox"]').is(':checked')) {
                           var number = $(this).attr('id').split('-')[1];
                           checkedRows[count] = number; //add the number to our array.
                           count++; //increase the count
                    }
                });
        });

Answer 2

首先确保您的表单和按钮有 ID，然后试试这个：

$('#buttonId').click(function(){
  $('#formId input:checked').each(i, e){
    console.log($(e).attr('id'));
  }
});

在 JavaScript 的按钮单击事件中打印与 HTML 中的复选框关联的值

Print values associated with checkboxes in HTML on button click event of JavaScript

html

javascript

arrays

html-parsing

javascript-objects