为什么这个混洗功能只对4+项起作用？包含JsFiddle
为什么这个混洗功能只对4+项起作用？包含JsFiddle
提问于 2018-06-09 02:41:49
我有下面的代码，它打乱了表中一行中的一组项。但是，仅当存在4+项时，随机播放功能才有效：
var parent = $("#parent");
function shuffleRows(parent) {
var rows = parent.children().children(".shuffledtd1");
for (var i = rows.length - 1; i > 0; i--) {
var j = Math.floor(Math.random() * (i + 1));
var temp = rows[i];
rows.eq(i - 1).after(rows[j]);
rows.eq(j - 1).after(temp);
}
}
shuffleRows(parent);<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<table>
<tbody id="parent">
<tr id="node2" class="shufflerow">
<td class="shuffledtd shuffledtd1">AA</td>
<td class="shuffledtd shuffledtd1">BB</td>
<!-- IF I DELETE THIS AND THE FOLLOWING ROW, THE PRIOR 2 ROWS NO LONGER SHUFFLE -->
<td class="shuffledtd shuffledtd1">CC</td>
<td class="shuffledtd shuffledtd1">DD</td>
</tr>
</tbody>
</table>
完整代码：http://jsfiddle.net/d8rkgx0z/
我认为它与这部分代码有关：
rows.eq(i - 1).after(rows[j]);
rows.eq(j - 1).after(temp);但是，不幸的是，我的技能不足以在没有几个小时的试验和错误的情况下隔离和纠正问题。
提前感谢您的帮助！
回答 1
Stack Overflow用户
发布于 2018-06-09 03:12:03
您的脚本可以大大简化，特别是使用适当的选择器和随机排序器(涵盖了在tr中对td排序的两种情况，或者在tbody中对tr排序的两种情况
const randomSorter = () => 0.5 - Math.random();
$('.shufflecells tr').each(function() {
$(this).html($('td', this).sort(randomSorter));
});
$('.shufflerows').each(function() {
$(this).html($('tr', this).sort(randomSorter));
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<table>
<tbody class="shufflecells">
<tr>
<td>AA</td>
<td>BB</td>
<td>CC</td>
<td>DD</td>
</tr>
</tbody>
</table>
<table>
<tbody class="shufflecells">
<tr>
<td>AA</td>
<td>BB</td>
</tr>
</tbody>
</table>
<table>
<tbody class="shufflerows">
<tr>
<td>AA</td>
</tr>
<tr>
<td>BB</td>
</tr>
<tr>
<td>CC</td>
</tr>
<tr>
<td>DD</td>
</tr>
</tbody>
</table>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/50766685
复制相关文章
相似问题