jQuery循环遍历表格行和单元格，选中复选框，然后连接

Question

我有一个包含多行的表。表格中有几列带有复选框。我需要遍历每个复选框，并在其中选中将来自该特定单元格的输入连接/连接到同一行的其他输入。

你可以在这里看到一个小提琴： http://jsfiddle.net/QS56z/10/

除了循环遍历行之外，我如何循环遍历每个<td> 一旦我有这个<td> 我如何在那个td 中查找名称以x 开头的输入。一旦找到将输入从该输入连接/连接到行中的输入。

我希望这是有道理的。

基本上： 我想将（家庭）加入（大小）到（等级），家庭和等级在同一行，并且每行有几个大小。每个结果都必须写入当前正在处理的 TD。

我已经走到了这一步，但卡住了：

function createcodes(){
    alert('running');
    //run through each row
    $('.authors-list tr').each(function(){
         //processing this row
            //how to process each cell(table td) where there is checkbox
        $($(this).find('input[name^="line"]').val(

            $('$(this).find('input[name^="family"]'').val() + ' ' + // common input(family) on row, use for all table cells(td)
            $('#$(this).find('input[name^="size"]'').val() + ', ' + // this cells input called size, unique to this cell only
            $('#$(this).find('input[name^="grade"]'').val() // common input(grade) on row, use for all table cells(td)
          );
          // end of cell row processing
      });
        //end of rows processing
}

一如既往的感谢。

http://jsfiddle.net/QS56z/10/

我的 html 是：

<table class="authors-list" border=1 id="ordertable">
 <tr>
     <td ><input type="text" id="product1" name="product1" class="rounded" value="38114CR"></td>
     <td ><input type="text" size='5' id="qty1" name="qty1" class="rounded" value="10"/></td> 
     <td class="tdcheckbox">
      <input type="checkbox"  id="h09_1" name="h09_1" checked class="rounded"/>
      <input type="text"  id="line_1_09" name="line_1_09" >
      <input type="text"  id="size_1_09" name="size_1_09" value="09">

    </td> 
     <td class="tdcheckbox">
      <input type="checkbox"  id="h12_1" name="h12_1" class="rounded"/>
      <input type="text"  id="line_1_12" name="line_1_12" value="">
      <input type="text"  id="size_1_12" name="size_1_12" value="12">
    </td> 
     <td class="tdcheckbox">
      <input type="checkbox"  id="h15_1" name="h15_1" checked class="rounded"/>
      <input type="text"  id="line_1_15" name="line_1_15" >
      <input type="text"  id="size_1_15" name="size_1_15" value="15">
    </td> 
    <td><input type="text" name="cubespercheck_1" id="cubespercheck_1" value="0" size=5></td>
    <td><input type="text" name="skufamily_1" id="skufamily_1" value="38114"></td>
    <td><input type="text" name="skugrade_1" id="skugrade_1" value="cr"></td>
 </tr>
</table>
<input type="button" id="continue" value="continue">

请记住有多个行。谢谢。

Answer 1

更新

我已经更新了你的演示：http://jsfiddle.net/terryyounghk/QS56z/18/

另外，我已将两个^= 更改为*=。见http://api.jquery.com/category/selectors/

并注意:checked 选择器。见http://api.jquery.com/checked-selector/

function createcodes() {

    //run through each row
    $('.authors-list tr').each(function (i, row) {

        // reference all the stuff you need first
        var $row = $(row),
            $family = $row.find('input[name*="family"]'),
            $grade = $row.find('input[name*="grade"]'),
            $checkedBoxes = $row.find('input:checked');

        $checkedBoxes.each(function (i, checkbox) {
            // assuming you layout the elements this way, 
            // we'll take advantage of .next()
            var $checkbox = $(checkbox),
                $line = $checkbox.next(),
                $size = $line.next();

            $line.val(
                $family.val() + ' ' + $size.val() + ', ' + $grade.val()
            );

        });

    });
}

Answer 2

试试这个：

function createcodes() {

    $('.authors-list tr').each(function () {
        //processing this row
        //how to process each cell(table td) where there is checkbox
        $(this).find('td input:checked').each(function () {

             // it is checked, your code here...
        });
    });
}