如果在jquery中单击该行中的复选框，如何获取行的值答案

【问题标题】：How to get value of row if checkbox in that row is clicked in jquery如果在jquery中单击该行中的复选框，如何获取行的值
【发布时间】：2014-12-23 12:07:49
【问题描述】：

如果选中同一行复选框，我想获取整行的值。例如

 <table id="tbl" border="1">
    <tr><input type="checkbox" id="selectall"/>
        <td>
        <input type="checkbox"/></td>
 <td>2</td>
<td>3</td>
<td>4</td>
    </tr>
    <tr><td><input type="checkbox"/></td>
 <td>2</td>
<td>3</td>
<td>4</td>
    </tr>
    <tr><td><input type="checkbox"/></td>
 <td>2</td>
<td>3</td>
<td>5</td>
    </tr>
</table>
<input type="button" value="save"/>

$('#selectall').click(function(event) {
          if(this.checked) {
              // Iterate each checkbox
              $(':checkbox').each(function() {
                  this.checked = true;
              });
          }
          else {
            $(':checkbox').each(function() {
                  this.checked = false;
              });
          }

        });

$("#save").click(function(){
   /If all selected value has to pass through ajax one by one row/
});

如果我按下保存按钮，我必须选择所有检查过的行值。请参考此fiddle。请帮我。提前致谢

【问题讨论】：

想要的数据格式是什么
数据格式应该是数组。这样如果选中，我就可以获得类似 ['1','2'.'3'] 的值。或者如果我通过 ajax 应该易于解析的任何其他格式

标签： jquery ajax checkbox

【解决方案1】：

试试

$('#selectall').click(function(event) {
  $(':checkbox').prop('checked', this.checked);
});

$("#save").click(function() {
  //reset the logger
  $('#log').empty();

  //get all the checked checboxex
  $('#tbl input:checkbox:checked').each(function() {
    //for each checked checkbox, iterate through its parent's siblings
    var array = $(this).parent().siblings().map(function() {
      return $(this).text().trim();
    }).get();
    //to print the value of array
    $('#log').append(JSON.stringify(array))
  })
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="checkbox" id="selectall" />
<table id="tbl" border="1">
  <tr>
    <td>
      <input type="checkbox" />
    </td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
  </tr>
  <tr>
    <td>
      <input type="checkbox" />
    </td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
  </tr>
  <tr>
    <td>
      <input type="checkbox" />
    </td>
    <td>2</td>
    <td>3</td>
    <td>5</td>
  </tr>
</table>
<input type="button" id="save" value="save" />
<div id="log"></div>

【讨论】：

嗨，伙计。你能告诉我现在把它改成json格式吗。

【解决方案2】：

您可以选中复选框并使用.closest() 获取最接近的行元素对象：

$('input:checked').closest('tr');

如果您正在寻找关于选中复选框的 td 元素，那么您可以使用：

$('input:checked').parent().siblings(); //if checkbox 3 is checked then it will have 3rd rows other three td elements having text 2,3,5.

更新：将它们放入数组中

arr=[];
/If all selected value has to pass through ajax one by one row/
 $('input:checked').parent().each(function(){
   arr.push($(this).siblings().map(function(){
     return $(this).text()
   }).get());
 });
 console.log(arr);

Working Demo

【讨论】：