如何使用javascript从重复器获得选定标签的值

本文关键字:标签 javascript 何使用 | 更新日期: 2023-09-27 18:12:37

我已经绑定了中继器,我想获得标签的值,而检查特定的复选框:

$(function() {
  $('.toggleCheck').change(function() {
    console.log('Toggle: ' + $(this).prop('checked'))
    RepeaterData();
  })
})
function RepeaterData() {
  var size = $('.nameLabel').length;
  console.log('size' + size);
  for (i = 0; i < size; i++) {
    var name = $('.nameLabel').eq(i).text();
    var id = $('.IdLabel').eq(i).text();
    //var result = document.getElementById('result');
    alert(name);
    // result.innerText += name + "  't " + id + "'n";
  }
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<asp:Repeater ID="rptCust" runat="server">
  <HeaderTemplate>
    <div class="table-responsive">
      <table class="table table-striped table-bordered table-hover table-highlight" data-provide="datatable" data-display-rows="10" data-info="true" data-search="true" data-length-change="true" data-paginate="true">
        <thead>
          <tr>
            <th data-filterable="true">No</th>
            <th>name</th>
            <th>Action</th>
          </tr>
        </thead>
        <tbody>
  </HeaderTemplate>
  <ItemTemplate>
    <tr>
      <td>
        <asp:Label ID="lblId" CssClass="IdLabel" runat="server" Text='<%#Eval("id")%>' Style="display: none"></asp:Label>
        <asp:Label ID="lblno" CssClass="nameLabel" runat="server" Text='<%#Eval("no")%>'></asp:Label>
      </td>
      <td>
        <asp:Label ID="lblname" runat="server" Text='<%#Eval("name")%>'></asp:Label>
      </td>
      <td>
        <input id="Checkbox1" commandname="Edit" data-toggle="toggle" type="checkbox" checked='<%# (Eval("status")).ToString() == "1" ? true : false %>' runat="server" class="toggleCheck">
      </td>
    </tr>
  </ItemTemplate>
  <FooterTemplate>
    </tbody>
    </table>
    </div>
  </FooterTemplate>
</asp:Repeater>

我已经写了上面的代码。

现在当我点击复选框时,我需要使用javascript获取该复选框的id。

我试图获得值,但它给了我所有的值,而不是特定的id复选框选中/未选中

当我选中/未选中复选框时,我如何获得特定id的值?

如何使用javascript从重复器获得选定标签的值

你可以这样做…

 $('.toggleCheck').click(function(){
    console.log($(this).attr('id'));
 })

或者如果您想确定是否已选中…

 $('.toggleCheck').click(function(){
    if($(this).is(':checked')){
      console.log($(this).attr('id'));
    }
 })

我已经解决了。代码如下:

我添加了var id = $(this).closest('tr').find('td:first-child').text();通过上面的行,我可以在复选框上获得特定的id复选框选中/未选中

   $(function() {
      $('.toggleCheck').change(function() {
        console.log('Toggle: ' + $(this).prop('checked'))
        var id = $(this).closest('tr').find('td:first-child').text();
      })
    })