Javascript 如何使用jQuery选择所有tbody输入值的值

所以我有一些复选框，当每个复选框都被选中时，我就能够从相关的表行中获得我需要的id号，并将它们放入我的contacts数组中

我还有一个全选复选框，它意味着抓取所有id号并将它们粘贴到同一个数组中

在试图找出正确的语法以tbody为目标时遇到了一些麻烦，请选择每个表行的数据id或每个表行的输入值

^在我的小提琴示例中，您可以看到数字被添加到我的数组或灰色div中进行可视化。 如何从“全选”复选框中的tbody行中获取所有id号

jQuery

var contacts = [];

// add multiple select / deselect functionality
$("#selectall").click(function () {
    $('.case').attr('checked', this.checked);
    //contacts.push($('#tbody').children(tr > td > input).val();)
});

// if all checkbox are selected, check the selectall checkbox
// and viceversa
$(".case").click(function() {

    var $tr = $(this).closest("tr");
    var id = $tr.data('coworker-id');

    contacts.push(id);

    $('#arrayContent').empty();
    $('#arrayContent').append(contacts+',');

    if ($(".case").length == $(".case:checked").length) {
        $("#selectall").attr("checked", "checked");
    } else {
        $("#selectall").removeAttr("checked");
    }   

});

HTML

---

您可以修改“全选”处理程序，如下所示：

$("#selectall").click(function () {
    $('.case').attr('checked', this.checked).each(function() {
         contacts.push($(this).val())
    });
});

---

您可以修改“全选”处理程序，如下所示：

$("#selectall").click(function () {
    $('.case').attr('checked', this.checked).each(function() {
         contacts.push($(this).val())
    });
});

---

我知道这不能完全回答使用子项的问题，但您可以使用$'tbody'。查找'input'来查找元素中的所有输入字段。

我知道这不能完全回答使用子项的问题，但您可以使用$'tbody'。查找'input'来查找元素中的所有输入字段。

以下是一个工作示例：

var contacts = [];

// add multiple select / deselect functionality

$("#selectall").click(function () {
    var els = $('.case')
    if (els.first().is(':checked') ) {
        els.prop('checked', false);
        $('#arrayContent').empty();
    } else {
        els.attr('checked', true);
        $.each(els, function(index, el) {
             contacts.push( $(el).val() ); 
        });
        $('#arrayContent').empty();
        $('#arrayContent').append(contacts.join( ', ' ) );
    }
    //contacts.push($('#tbody').children(tr > td > input).val();)
});

// if all checkbox are selected, check the selectall checkbox
// and viceversa

$(".case").click(function() {

    var $tr = $(this).closest("tr");
    var id = $tr.data('coworker-id');

    contacts.push(id);

    $('#arrayContent').empty();
    $('#arrayContent').append(contacts+',');

    if ($(".case").length == $(".case:checked").length) {
        $("#selectall").attr("checked", "checked");
    } else {
        $("#selectall").removeAttr("checked");
    }   

});

---

这里是小提琴链接：：

这里是一个工作示例：

var contacts = [];

// add multiple select / deselect functionality

$("#selectall").click(function () {
    var els = $('.case')
    if (els.first().is(':checked') ) {
        els.prop('checked', false);
        $('#arrayContent').empty();
    } else {
        els.attr('checked', true);
        $.each(els, function(index, el) {
             contacts.push( $(el).val() ); 
        });
        $('#arrayContent').empty();
        $('#arrayContent').append(contacts.join( ', ' ) );
    }
    //contacts.push($('#tbody').children(tr > td > input).val();)
});

// if all checkbox are selected, check the selectall checkbox
// and viceversa

$(".case").click(function() {

    var $tr = $(this).closest("tr");
    var id = $tr.data('coworker-id');

    contacts.push(id);

    $('#arrayContent').empty();
    $('#arrayContent').append(contacts+',');

    if ($(".case").length == $(".case:checked").length) {
        $("#selectall").attr("checked", "checked");
    } else {
        $("#selectall").removeAttr("checked");
    }   

});

这里是小提琴链接：：

你可以试试这个

$("#selectall").click(function () {

if($('.case:checked').length == $('.case').length){
    //deselect all
    $('.case').removeAttr("checked");
    contacts = [];
}
else{
    //select all
    $('.case').attr("checked", "checked").each(function(){

        var $tr = $(this).closest("tr");
        var id = $tr.data('coworker-id');

        contacts.push(id);

    })
}    




$('#arrayContent').empty();
$('#arrayContent').append(contacts.join(','));
//contacts.push($('#tbody').children(tr > td > input).val();)
});

你可以试试这个

$("#selectall").click(function () {

if($('.case:checked').length == $('.case').length){
    //deselect all
    $('.case').removeAttr("checked");
    contacts = [];
}
else{
    //select all
    $('.case').attr("checked", "checked").each(function(){

        var $tr = $(this).closest("tr");
        var id = $tr.data('coworker-id');

        contacts.push(id);

    })
}    




$('#arrayContent').empty();
$('#arrayContent').append(contacts.join(','));
//contacts.push($('#tbody').children(tr > td > input).val();)
});

使用find而不是children，然后循环元素以将它们添加到数组中

$("#selectall").click(function () {
  $('.case').attr('checked', this.checked);
  $('tbody').find("input").each(function () {
    contacts.push($(this).val()+",");
  });
  $('#arrayContent').append(contacts);
});

.find和.children方法类似，只是后者只在DOM树中向下移动一层

来源：

使用find而不是children，然后循环元素以将它们添加到数组中

$("#selectall").click(function () {
  $('.case').attr('checked', this.checked);
  $('tbody').find("input").each(function () {
    contacts.push($(this).val()+",");
  });
  $('#arrayContent').append(contacts);
});

.find和.children方法类似，只是后者只在DOM树中向下移动一层

---

资料来源：

我想我已经明白了！使用$'tbody tr'.eachfunction{contacts.push$this.data'coworker-id'；要做更多的测试并在我的应用程序中尝试它我想我刚刚找到了答案！使用$'tbody tr'.eachfunction{contacts.push$this.data'coworker-id'；将进行更多测试并在我的appWoot中试用！我认为这是迄今为止最简单的解决方案：Ok cool我选择这个作为代码的租约金额，我还可以在大pushWoot之前轻松重置我的数组！我认为这是迄今为止最简单的解决方案：Ok cool我选择这个作为租约金额代码，我还可以在大推之前轻松重置我的数组谢谢你花时间！D+1没问题，很乐意帮助，这也可以改进，它可以工作，但可能会更好，现在你看到它是如何工作的，试着改进它谢谢你花时间！D+1没问题，很乐意帮助，这也可以改进，是吗工作，但它可以更好，现在你看到它是如何工作的，尝试改善它