javascript - 选中标题复选框时获取每个选中行的特定单元格值

Question

我的 gridview 具有标题复选框，并且每行都有复选框。当我单击标题复选框时，我需要检查子复选框是否已选中，如果选中，我需要获取所有选中行的第三个单元格值。

为此目的，我正在执行以下 Javascript 函数:

 function toggleSelection(source) {
    $("#MainContent_gvCG input[id*='chkCert']").each(function (index) {
        if(source.checked) {
            if (this.checked) {

               ////Here i need to access the third cell values of all rows

            }
        }
    });
}

示例表格格式(为了更好地理解):

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">
 </script>
 <table border="1">
  <tr>
    <th>CFS Name</th>
    <th>Amount</th>
    <th>TCFSA</th>
    <th>CODEX</th>
    <th><input type="checkbox" id="chkHeader"/></th>
  </tr>
  <tr>
    <td>TRANSWORLD GLS INDIA</td>
    <td>Abc</td>
    <td>cg</td>
    <td>de</td>
    <td><input type="checkbox" class="chkCert"></td>
  </tr>
  ................
  ...............
  ..............
  </table>

这是我的 GridView :

     <asp:GridView ID="gvPRCertInfo" runat="server" AutoGenerateColumns="False" GridLines="None"                     
           OnRowDataBound="gvPRCertInfo_RowDataBound"
            CssClass="data responsive">
             <Columns>
                <asp:TemplateField HeaderText="Select" SortExpression="">
                 <HeaderTemplate>
                   <asp:CheckBox ID="chkboxSelectAll" runat="server" AutoPostBack="true" onclick="toggleSelection(this);"  OnCheckedChanged="chkboxSelectAll_CheckedChanged"/>
                     </HeaderTemplate>
                       <ItemTemplate>
                        <asp:CheckBox ID="chkCert" AutoPostBack="true" OnCheckedChanged="chkCert_CheckedChanged"  runat="server" />                                    
                         <input type="hidden" id="hdnCertId" runat="server" value='<%# DataBinder.Eval(Container.DataItem, "CertId") %>' />
                       </ItemTemplate>
                    </asp:TemplateField>
                    <asp:BoundField DataField="CertificateID" HeaderText="Certificate ID" HeaderStyle-HorizontalAlign="Center" />
         ....................
         .....................
         ..............
       </Columns>                            
   </asp:GridView>

任何人都可以就如何访问所有选中行的第三个单元格值提出任何想法吗？除此之外的任何更好的解决方案也欢迎。

修改后的代码:

function toggleSelection(source) {
    $('#<%= gvPRCertInfo.ClientID %> input[id*="chkCert"]').each(function () {
            if (source.checked) {
                alert("source checked");
                if (this.checked) {
                    alert("child chk");
                    var allVlues = $(this).closest('tr').children('td:eq(4)').html();
                    alert(allVlues);

                }
            }
        });
    }

我无法发出此警报alert("child chk");，有人可以帮忙解决这个问题吗？

Answer 1

尝试$(this).parent().parent().find('td:eq(2)').text();。另请注意 $("#MainContent_gvCG input.chkCert:checkbox").each(....

中的更改

function toggleSelection(source) {
  $("#MainContent_gvCG input.chkCert:checkbox").each(function (index) {
      if(source.checked) {
          if (this.checked) {
             let thirdVal = $(this).parent().parent().find('td:eq(2)').text();
       console.log(thirdVal);
          }
      }
  });
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table border="1" id="MainContent_gvCG" >
  <tr>
    <th>CFS Name</th>
    <th>Amount</th>
    <th>TCFSA</th>
    <th>CODEX</th>
    <th><input type="checkbox" id="chkHeader" onclick="toggleSelection(this);"/></th>
  </tr>
  <tr>
    <td>TRANSWORLD GLS INDIA</td>
    <td>Abc</td>
    <td>cg</td>
    <td>de</td>
    <td><input type="checkbox" class="chkCert"></td>
  </tr>  
  <tr>
    <td>Test</td>
    <td>mnl</td>
    <td>opq</td>
    <td>xyz</td>
    <td><input type="checkbox" class="chkCert" checked></td>
  </tr>
</table>