gpt4 book ai didi

jquery - 单独在一行上运行 jQuery 函数

转载 作者:行者123 更新时间:2023-12-01 04:02:14 26 4
gpt4 key购买 nike

我正在尝试重新排序一个 html 表格,其中一个数值位于错误的位置,但无法以常规方式修改其位置。

我已经运行这个脚本来尝试对 td 进行重新排序,但是我遇到了以下问题:尺寸可以重新排序,但我们将两行复制到一行上,例如尺寸将变为 8,8 ,10,10,12,12 等

我尝试运行各种不同的每个循环,但没有成功。请问有人可以给我提示吗?

下面是表格格式,下面是我一直用来尝试重新排序的代码,因为它不适合我。

<div id="attributeInputs" class="attribute-inputs js-type-grid">
<table class="js-grid">
<thead>
<tr>
<th class="js-col1"></th>
<th class="js-col2" colspan="8"></th>
</tr>
</thead>
<tbody><tr><th rowspan="1"></th>
<th class="js-rowtitleX">10</th>
<th class="js-rowtitleX">12</th>
<th class="js-rowtitleX">14</th>
<th class="js-rowtitleX">16</th>
<th class="js-rowtitleX">18</th>
<th class="js-rowtitleX">20</th>
<th class="js-rowtitleX">22</th>
<th class="js-rowtitleX">8</th>
</tr>
<tr>
<th class="js-rowtitleY">Red</th>
<td class="js-gridBlock js-In_stock" data-attvalue1="10" data-attvalue2="Red" <span class="status">In stock</span></td>
<td class="js-gridBlock js-In_stock" data-attvalue1="12" data-attvalue2="Red" <span class="status">In stock</span></td>
<td class="js-gridBlock js-In_stock" data-attvalue1="14" data-attvalue2="Red" <span class="status">In stock</span></td>
<td class="js-gridBlock js-In_stock" data-attvalue1="16" data-attvalue2="Red" <span class="status">In stock</span></td>
<td class="js-gridBlock js-In_stock" data-attvalue1="18" data-attvalue2="Red" <span class="status">In stock</span></td>
<td class="js-gridBlock js-In_stock" data-attvalue1="20" data-attvalue2="Red" <span class="status">In stock</span></td>
<td class="js-gridBlock js-In_stock" data-attvalue1="22" data-attvalue2="Red" <span class="status">In stock</span></td>
<td class="js-gridBlock js-In_stock" data-attvalue1="8" data-attvalue2="Red" <span class="status">In stock</span></td>

</tr>
<tr>
<th class="js-rowtitleY">Blue</th>
<td class="js-gridBlock js-In_stock" data-attvalue1="10" data-attvalue2="Blue" <span class="status">In stock</span></td>
<td class="js-gridBlock js-In_stock" data-attvalue1="12" data-attvalue2="Blue" <span class="status">In stock</span></td>
<td class="js-gridBlock js-In_stock" data-attvalue1="14" data-attvalue2="Blue" <span class="status">In stock</span></td>
<td class="js-gridBlock js-In_stock" data-attvalue1="16" data-attvalue2="Blue" <span class="status">In stock</span></td>
<td class="js-gridBlock js-In_stock" data-attvalue1="18" data-attvalue2="Blue" <span class="status">In stock</span></td>
<td class="js-gridBlock js-In_stock" data-attvalue1="20" data-attvalue2="Blue" <span class="status">In stock</span></td>
<td class="js-gridBlock js-In_stock" data-attvalue1="22" data-attvalue2="Blue" <span class="status">In stock</span></td>
<td class="js-gridBlock js-In_stock" data-attvalue1="8" data-attvalue2="Blue" <span class="status">In stock</span></td>
</tr>
</tbody
</table>
</div>

$("#attributeInputs > table > tbody > tr > td").sort(sort_td).appendTo('#attributeInputs > table > tbody > tr:nth-child(n+2)');
function sort_td(a, b){
return ($(b).data('attvalue1')) < ($(a).data('attvalue1')) ? 1 : -1;}

最佳答案

问题是因为您附加的选择器中有两个元素,因此元素是重复的。要解决此问题,您应该循环遍历 tr 元素并分别对其中的 td 进行排序。试试这个:

$("#attributeInputs > table > tbody > tr").each(function() {
$(this).find('td').sort(sort_td).appendTo(this);
})

Working example

关于jquery - 单独在一行上运行 jQuery 函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38722889/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com