Question

如何使用相同的类重排标签？这是我想要做的一个例子

<div>
A. <label class="shuffle">1</label>
B. <label class="shuffle">2</label>
C. <label class="shuffle">3</label>
</div>

A. 1
B. 2
C. 3

这将是我的预期输出。

A. 3
B. 1
C. 2

我一直在尝试THIS解决方案，但似乎在随机播放时它会附加在底部。

Answer 1

最简单的方法是对一组文本字符串进行随机播放并替换每个

中的文本

这避免了尝试交换元素，因为您有其他文本节点与每个元素内联，并希望这些文本节点保持原位。

＆＃13;

var $labels = $('.shuffle'),
  // map text of each to array
  textArr = $labels.map(function(_, el) {
    return $(el).text()
  }).get()
  // random sort text array
  .sort(function() {
    return Math.random() - .5;
  });
  // set new text using matching index in sorted text array
  $labels.text(function(i){
     return textArr[i];
  })

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
A. <label class="shuffle">1</label>
B. <label class="shuffle">2</label>
C. <label class="shuffle">3</label>
</div>

＆＃13;

用相同的类洗牌所有标签

1 个答案: