我有一个向下钻取列表，每行中都包含一个按钮。如何使用jQuery隐藏这些按钮？
我尝试了以下代码，但找不到该按钮。
$(".s_invoicedtl").closest(".card").find(".btn-default")
这里是包含按钮的行之一的HTML-
<tr class="ew-table-preview-row">
<td class="ew-table-last-col ew-table-last-row" colspan="10">
<!-- preview -->
<div class="ew-nav-tabs">
<!-- .ew-nav-tabs -->
<ul class="nav nav-tabs">
<li class="nav-item"><a href="#" class="nav-link active" data-toggle="tab" data-table="s_invoicedtl"
data-url="/s_invoicedtlpreview?t=s_invoice&f=gKD81aAcp3oYWIAnst6HVg" data-target="#131127">s
invoicedtl <span class="badge badge-info ew-detail-count1">1</span></a></li>
</ul>
<div class="tab-content">
<!-- .tab-content -->
<div class="tab-pane fade active show" id="131127">
<div class="card ew-grid s_invoicedtl">
<!-- .card -->
<div class="table-responsive card-body ew-grid-middle-panel ew-preview-middle-panel">
<!-- .table-responsive -->
<table class="table ew-table ew-preview-table">
<!-- .table -->
<thead>
<!-- Table header -->
<tr class="ew-table-header">
<th class="ew-table-header-cell">
<div class="ew-pointer" data-sort="Id_item_code" data-sort-order="ASC">
<div class="ew-table-header-btn">
<span class="ew-table-header-caption">Item</span>
<span class="ew-table-header-sort"></span>
</div>
</div>
</th>
<th class="ew-table-header-cell">
<div class="ew-pointer" data-sort="qty" data-sort-order="ASC">
<div class="ew-table-header-btn">
<span class="ew-table-header-caption">Qty</span>
<span class="ew-table-header-sort"></span>
</div>
</div>
</th>
<th class="ew-table-header-cell">
<div class="ew-pointer" data-sort="price_unit" data-sort-order="ASC">
<div class="ew-table-header-btn">
<span class="ew-table-header-caption">Unit Price</span>
<span class="ew-table-header-sort"></span>
</div>
</div>
</th>
<th class="ew-table-header-cell">
<div class="ew-pointer" data-sort="Id_uom" data-sort-order="ASC">
<div class="ew-table-header-btn">
<span class="ew-table-header-caption">Unit</span>
<span class="ew-table-header-sort"></span>
</div>
</div>
</th>
<th class="ew-table-header-cell">
<div class="ew-pointer" data-sort="Id_taxmaster" data-sort-order="ASC">
<div class="ew-table-header-btn">
<span class="ew-table-header-caption">Tax</span>
<span class="ew-table-header-sort"></span>
</div>
</div>
</th>
<th class="ew-table-header-cell">
<div class="ew-pointer" data-sort="tax_rate" data-sort-order="ASC">
<div class="ew-table-header-btn">
<span class="ew-table-header-caption">TxRate</span>
<span class="ew-table-header-sort"></span>
</div>
</div>
</th>
<th class="ew-table-header-cell">
<div class="ew-pointer" data-sort="discount" data-sort-order="ASC">
<div class="ew-table-header-btn">
<span class="ew-table-header-caption">Discount</span>
<span class="ew-table-header-sort"></span>
</div>
</div>
</th>
<th class="ew-table-header-cell">
<div class="ew-pointer" data-sort="taxamount" data-sort-order="ASC">
<div class="ew-table-header-btn">
<span class="ew-table-header-caption">Tax</span>
<span class="ew-table-header-sort"></span>
</div>
</div>
</th>
<th class="ew-table-header-cell ew-table-last-col">
<div class="ew-pointer" data-sort="amount" data-sort-order="ASC">
<div class="ew-table-header-btn">
<span class="ew-table-header-caption">Amount</span>
<span class="ew-table-header-sort"></span>
</div>
</div>
</th>
</tr>
</thead>
<tbody>
<!-- Table body -->
<tr class="ew-table-row">
<td class="ew-table-last-row">
<span>SDSCFi1, Stam Duty: Facility Agreement SCF-i.1</span>
</td>
<td style="text-align: right;" class="ew-table-last-row">
<span>5</span>
</td>
<td style="text-align: right;" class="ew-table-last-row">
<span>44,020.00</span>
</td>
<td class="ew-table-last-row">
<span>UNIT</span>
</td>
<td class="ew-table-last-row">
<span>SRG0 </span>
</td>
<td style="text-align: right;" class="ew-table-last-row">
<span>0.00</span>
</td>
<td style="text-align: justify;" class="ew-table-last-row">
<span>0.00</span>
</td>
<td style="text-align: right;" class="ew-table-last-row">
<span>0.00</span>
</td>
<td style="text-align: right;" class="ew-table-last-col ew-table-last-row">
<span>220,100.00</span>
</td>
</tr>
</tbody>
</table><!-- /.table -->
</div><!-- /.table-responsive -->
<div class="card-footer ew-grid-lower-panel ew-preview-lower-panel">
<!-- .card-footer -->
<div class="ew-preview-other-options">
</div>
<div class="clearfix"></div>
</div><!-- /.card-footer -->
</div><!-- /.card -->
<div data-table="s_invoicedtl" data-url="/s_invoicedtlpreview?t=s_invoice&f=gKD81aAcp3oYWIAnst6HVg"
class="btn-group btn-group-sm">
<button type="button" class="btn btn-default" title=""
onclick="window.location='/s_invoicedtllist?showmaster=s_invoice&fk_Id=26'"
data-original-title="s invoicedtl">
<i data-phrase="MasterDetailListLink" class="icon-table ew-icon" data-caption="Detail List">
</i>
</button>
</div>
</div>
</div><!-- /.tab-content -->
</div><!-- /.ew-nav-tabs -->
</td>
</tr>
.find()尝试不起作用，因为当按钮是您选择的sibling时，它将搜索从您选择的内容开始的降序搜索>
[尝试保持与您最初尝试的方式相似，您可以使用next sibling selector ~查找与next sibling selector ~在同一元素组中的按钮，或使用.s_invoicedt1在DOM之前向上移动DOM尝试.parent().find()您的按钮
.find()let $button = $('.card.s_invoicedtl ~ .btn-group .btn'); // let $button = $('.card.s_invoicedtl').parent().find('.btn-group .btn'); $(document).ready(function () { console.log($button.length); $button.hide(); })
如果要在开始时隐藏类为'.btn-default'的每个按钮，
如果您想在单击按钮时隐藏按钮，则只需将其添加到按钮中：