jQuery选择具有相同类的随机元素

bos*_*maj 3 random jquery element class

我有类"selectElement"的元素.当我点击该类的元素时,我"选择"它,并给它另一个类"selectedElements",如果它还没有它.

但是,我有一个按钮,应该随机选择具有类"selectElement"的某些数字(例如10个)元素并给它们"selectedElement"类.

我在这个答案中尝试了类似的东西 - > /sf/answers/123524061/,但每次都返回相同的值...

编辑:解决了Jon的帮助.这是其他有类似问题的用户的代码:)

$("#chooseElementsRand").live("click",function(){
    $(".selectedElements").removeClass("selectedElements");
    var maxNum = parseInt($(".maxNum").html());
    var randomElements = shuffle($(".selectElement")).slice(0,maxNum).addClass("selectedElements");
    $(".selectedNum").html(randomElements.length);
    if(randomElements.length==maxNum) {
        $(".buttonToProceed").removeClass("notShown");
    }
});
Run Code Online (Sandbox Code Playgroud)

Jon*_*Jon 13

每当你想挑N个元素真正随机出X的,该解决方案是费雪耶茨洗牌.这个页面有一个Javascript实现(加上理由,加上漂亮的动画,所以去看看):

function shuffle(array) {
  var m = array.length, t, i;

  // While there remain elements to shuffle…
  while (m) {

    // Pick a remaining element…
    i = Math.floor(Math.random() * m--);

    // And swap it with the current element.
    t = array[m];
    array[m] = array[i];
    array[i] = t;
  }

  return array;
}
Run Code Online (Sandbox Code Playgroud)

鉴于随机播放,您可以随机选择X元素

var items = shuffle($(".selectElement")).slice(0, X);
Run Code Online (Sandbox Code Playgroud)

这是一个可以玩的小提琴.

脚注:由于您只对一定数量的随机选择感兴趣,因此无需像shuffle上面那样无条件地对整个输入数组进行随机播放; 你可以只.slice洗掉一小部分,然后用它来切断它并使用它.我把它当作一种练习; 小心不要错误地抓住*un*shuffled部分!


Nis*_* Up 6

您可以使用 jquery 方法按类名选择随机项目 eq()

请参见下面的示例。

var len = $(".someClass").length;
var random = Math.floor( Math.random() * len ) + 1;
$(".someClass").eq(random).css("background-color", "yellow");
Run Code Online (Sandbox Code Playgroud)