Javascript 如何随机选择具有相同类的元素?

Javascript 如何随机选择具有相同类的元素?,javascript,jquery,html,css,css-transitions,Javascript,Jquery,Html,Css,Css Transitions,jquery中是否有任何选项可以随机选择相同类名中的元素的编号(3) 实际上,我只想滑出3个项目,它们应该是随机的 function e(e) { var t = $(window).scrollTop(), n = t + $(window).height(), r = $(e).offset().top, i = r + $(e).height() * .8; return i >= t && r <

jquery中是否有任何选项可以随机选择相同类名中的元素的编号
(3)

实际上,我只想滑出3个项目,它们应该是随机的

function e(e) {
    var t = $(window).scrollTop(),
        n = t + $(window).height(),
        r = $(e).offset().top,
        i = r + $(e).height() * .8;
    return i >= t && r <= n && i <= n && r >= t
}

function s() {
    if (e(t) && !i) {
        r.each(function (e) {
            $(this).delay(200 + e * 50).animate({
                top: "-110%"
            }, 500)
        }).each(function (e) {
            $(this).delay(200 + e * 100).animate({
                top: "0%"
            }, 500)
        });
        i = !0
    }
    i && $(window).unbind("scroll", s)
}
var n = $("#thumbs"),
    t = $(".thumbnails"),
    r = n.find(".thumb-info"),
    i = !1;
s();
$(window).bind("scroll", s);
函数e(e){
var t=$(窗口).scrollTop(),
n=t+$(窗口).height(),
r=$(e).offset().top,
i=r+$(e).高度()*.8;
返回i>=t&r
说明:

  • $('.thumbnails')
    选择具有类
    缩略图的所有元素
  • 从数组中返回3个随机元素(检查链接)
  • .slice(0,3)
    获取无序数组的前3个值

  • 下面是我为查看结果而制作的小提琴:

    例如,使用洗牌算法

    function shuffleArray(a) { // Fisher-Yates shuffle, no side effects
        var i = a.length, t, j;
        a = a.slice();
        while (--i) t = a[i], a[i] = a[j = ~~(Math.random() * (i+1))], a[j] = t;
        return a;
    }
    
    洗牌你的元素数组

    myArray = shuffleArray(myArray);
    
    现在,第一个
    3
    项目是随机的,所以请使用幻灯片对其进行循环

    var i;
    for (i = 0; i < 3 && i < myArray.length; ++i) {
        // slide myArray[i]
    }
    
    vari;
    对于(i=0;i<3&&i
    这是纯js,可以满足您的需要

    var fys=function(d,a,b,c){ //FisherYatesShuffle
     a=d.length;
     while(--a){
      b=Math.floor(Math.random()*(a-1));
      c=d[a];d[a]=d[b];d[b]=c;
     }
    };
    var el=document.getElementsByClassName('thumbnails'),l=el.length;
    var n=[];while(l--){n[l]=l};
    fys(n)
    
    n现在包含带有随机索引的数组,您可以使用


    el[n[0]]
    调用第一个随机元素。

    对于一个元素很简单,请执行以下操作:

    var items = $('.item').length;
    var currentItem = Math.floor(Math.random() * (items + 1));
    $('.item').eq(currentItem).doSomething();
    
    对于某些要素:

    var number = 10;
    for(i=0; i <= number; i++) {
        $('.item').eq(randomElement('.item')).doSomething();
    }
    
    function randomElement(el){
        var items = $(el).length;
        var currentItem = Math.floor(Math.random() * (items + 1));
        return currentItem;
    }
    
    var数=10;
    
    对于(i=0;我使用Math.rand获取一个随机种子,并使用它选择元素(例如基于它们的索引)实现
    Math.floor((Math.random()*r.length)+1);
    @SomeshMukherjee
    Math.rand
    不存在。您可能是指
    Math.random()
    返回一个介于0和1之间的小数。@Broxzier是的,这就是我的意思。你可以将它乘以你的最大值得到一个随机数。Math.random()*3要获得0,1,2,请为函数和变量使用较短的名称好吗?我看不到你的建议中有太多的随机性。是什么阻止了你三次选择同一个项目,导致只移动一个项目?这也极有可能
    el[el.length]
    将被选中,这是未定义的。向人们解释某些事情的最佳方式是始终使用尽可能短的变量名,这样人们就可以清楚地了解a、b、c、d、e、f、g、h和i变量的设置,因为这些变量很容易记住。错误!在发布示例时使用正确的变量名。不是所有阅读的人都这样做答案是可以轻松使用JavaScript。Fisher-Yates shuffle可能太长了。您只需要读取el&n两个变量…el包含带有类缩略图的元素集合,n包含带有el的无序索引的数组。请。。。
    var number = 10;
    for(i=0; i <= number; i++) {
        $('.item').eq(randomElement('.item')).doSomething();
    }
    
    function randomElement(el){
        var items = $(el).length;
        var currentItem = Math.floor(Math.random() * (items + 1));
        return currentItem;
    }