想要使用 jquery 获取选中复选框的所有值答案

【问题标题】：Want to get all values of checked checkbox using jquery想要使用 jquery 获取选中复选框的所有值
【发布时间】：2014-09-11 14:49:10
【问题描述】：

我如何在一个变量中获取多个复选框值，因为它只显示警报时最后检查的值？我是 jquery 的初学者，任何帮助将不胜感激。

我的工作链接是：

link

//HTML

<table border="0">       
    <tr>
        <td>Time</td>
        <td class="weekr1">Monday</td>
        <td class="weekr1">tuesday</td>
        <td class="weekr1">Wednesday</td>
        <td class="weekr1">Thursday</td>
        <td class="weekr1">Friday</td>
        <td class="weekr1">Saturday</td>
        <td class="weekr1">Sunday</td>
    </tr>   
    <tr>
        <td class="timer1">9-11</td>  
        <td><input type="checkbox" name="checkbox" class="r1"/>select </td>
        <td><input type="checkbox" name="checkbox" class="r1"/>select </td>
        <td><input type="checkbox" name="checkbox" class="r1"/>select </td>
        <td><input type="checkbox" name="checkbox" class="r1"/>select </td>
        <td><input type="checkbox" name="checkbox" class="r1"/>select </td>
        <td><input type="checkbox" name="checkbox" class="r1"/>select </td>
        <td><input  name="checkbox" type="checkbox"  class="r1" />select</td>
    </tr>  
    <tr>
        <th class="timer2">11-1</th>  
        <td><input type="checkbox"  class="r2"/>select </td>
        <td><input type="checkbox"  class="r2" />select</td>
        <td><input type="checkbox"  class="r2"/>select </td>
        <td><input type="checkbox"  class="r2"/>select </td>
        <td><input type="checkbox"  class="r2"/>select </td>
        <td><input type="checkbox"  class="r2"/>select </td>
        <td><input type="checkbox"  class="r2"/>select </td>
    </tr>
    <tr>
        <th class="timer3">1-2</th>  
        <td><input type="checkbox"  class="r3"/>select </td>
        <td><input type="checkbox"  class="r3"/>select </td>
        <td><input type="checkbox"  class="r3"/>select </td>
        <td><input type="checkbox"  class="r3"/>select </td>
        <td><input type="checkbox"  class="r3"/>select </td>
        <td><input type="checkbox"  class="r3"/>select </td>
        <td><input type="checkbox"  class="r3" />select</td>
    </tr>
    <tr>
        <th class="timer4">2-3</th>  
        <td><input type="checkbox"  class="r4"/>select </td>
        <td><input type="checkbox"  class="r4"/>select </td>
        <td><input type="checkbox"  class="r4"/>select </td>
        <td><input type="checkbox"  class="r4"/>select </td>
        <td><input type="checkbox"  class="r4"/>select </td>
        <td><input type="checkbox"  class="r4"/>select </td>
        <td><input type="checkbox"  class="r4" />select</td>
    </tr>
</table>  
<input type="submit" id="submit" value="Save time sheet" />

//jQuery代码

$(function(){
    $('input:not(#submit)').click(function()
  { 
   t= $(this).attr('class'); 


    text= $('.time'+t).text(); 
     //alert(text);      



  });

  // For getting the Day
   $('td').click(function()
  {  
    index = this.cellIndex;   


   days = $('tr:first').find('td').eq(index).text(); 

 // alert(days);
 });  

 // for saving data into the database
   $('#submit').click(function() {
                     alert(text);
                 alert(days);


            /*     $.ajax({
                    type: "POST",
                    cache: false,       
                    url: 'save.php',
                    data: {'time='+time, 'day='+day},
                    success: function(data) {
                        alert('data has been stored to database');
                    }
                    }); */
                    });

});

【问题讨论】：

代码就是代码？？？？？？找不到它的文件
寻求调试帮助的问题（“为什么这段代码不起作用？”） 必须包括所需的行为、特定问题或错误以及重现所需的最短代码问题本身。没有明确问题陈述的问题对其他读者没有用处。见：How to create a Minimal, Complete, and Verifiable example.
请立即查看，不便之处见谅

标签： php jquery ajax checkbox

【解决方案1】：

试试，

var trs = $('table tr');
var values = trs.first().find('td');

var values1 = $('table tr td :checkbox:checked').map(function () {
  return $(this).closest('tr').find('th').text() + "==>"
         + values.eq($(this).parent().index()).text();
}).get();

DEMO

【讨论】：

您好，当我选择星期一时，它又没有显示时间。

【解决方案2】：

获取长度

 $("[type=checkbox]").change(function(){
       alert($("[type=checkbox]:checked").length);
});

在jquery中使用map获取所有值

$("[type=checkbox]").change(function(){
     var arr=$("[type=checkbox]:checked").map(function(){
    return this.value;
    }).get();
    alert(arr);
});

DEMO

【讨论】：

@RajaprabhuAravindasamy 你怎么这么说..如果你不设置复选框的值，如果它被选中，那么这个值是 on 。这是默认值

【解决方案3】：

$(document).ready(function(){
    $('#submit').click(function(){
       var checkboxes = [];
       $('input[type="checkbox"]:checked').each(function(){
           checkboxes.push({class: $(this).attr('class'), value: $(this).val(), tr: $($(this).parents("tr")[0]).text(), td: $(this).parents("table").find("tr:eq("+ $(this).parent("td").index() +")").text()});
       });
       console.log(checkboxes);
    });
});

更新 Fiddle

【讨论】：

你好，谢谢你的评论，我应该把这段代码放在哪里？在我的代码中
@AmrinderSingh 单击后检查控制台（在检查选项卡中）。是你想要的吗？