jQuery遍历表行和单元格(在其中选中checkob的情况下) [英] jquery to loop through table rows and cells, where checkob is checked, concatenate

问题描述

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

I have a table with multiple rows. there are several columns in the table with checkboxes. I need to loop through each of the checkboxes, where it is checked concatenate/join the input from that particular cell to other inputs from the same row.

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

you can see a fiddle here: http://jsfiddle.net/QS56z/10/

除了循环遍历该行之外，我如何才能在每个<td>中循环遍历每个<td>，如何在该td中查找名称以x开头的输入.一旦找到，就可以将输入从该输入连接到行中.

How can I, in addition to looping through the row, loop through each <td> once I have this <td> how can I look for an input whose name starts with x in that td. once found concatenate / join the input from that to the inputs in the row.

我希望这是有道理的.

基本上: 我想将(家庭)到(大小)到(年级)加入，其中家庭和年级在同一行，并且每行有多个大小.每个结果都必须写入当前正在处理的TD.

essentially: I want to join the (family) to the (size) to the (grade) where family and grade are on the same row, and there are several sizes on each row. each result must be written to the TD currently being processed.

我已经到了这一步，但是被卡住了:

I have got up to this point but have got stuck:

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">

请记住，有多行.谢谢.

keep in mind there are multiple rows. Thanks.

推荐答案

更新

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

I've updated your demo: http://jsfiddle.net/terryyounghk/QS56z/18/

此外，我将两个^=更改为*=.请参见 http://api.jquery.com/category/selectors/

Also, I've changed two ^= to *=. See http://api.jquery.com/category/selectors/

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

And note the :checked selector. See 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()
            );

        });

    });
}

这篇关于jQuery遍历表行和单元格(在其中选中checkob的情况下)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！