Warning: file_get_contents(/data/phpspider/zhask/data//catemap/6/haskell/10.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript jquery不重复地添加随机类_Javascript_Jquery_Random_Addclass_Removeclass - Fatal编程技术网

Javascript jquery不重复地添加随机类

Javascript jquery不重复地添加随机类,javascript,jquery,random,addclass,removeclass,Javascript,Jquery,Random,Addclass,Removeclass,我正在使用我网站上的一个函数将类随机添加到一个div中。 工作正常,但我找不到一种方法不一个接一个地重复同一个类两次(因为有时添加了同一个类,我们可能认为代码不工作) 以下是我的jquery代码: $("#switch").click(function(){ var classes = ["vert", "escalier","reverse","demi_escalier","demi_escalier_2","ligne" ]; $("#logo").removeClass().addC

我正在使用我网站上的一个函数将类随机添加到一个div中。 工作正常,但我找不到一种方法不一个接一个地重复同一个类两次(因为有时添加了同一个类,我们可能认为代码不工作)

以下是我的jquery代码:

$("#switch").click(function(){

var classes = ["vert", "escalier","reverse","demi_escalier","demi_escalier_2","ligne" ];

$("#logo").removeClass().addClass(classes[~~(Math.random()*classes.length)]);

});
有人能帮我吗


谢谢

如果您不想重复上课,可以使用以下方法:

var类=[“垂直”、“垂直”、“反向”、“半水平”、“半水平”、“垂直2”、“直线”];
var classesCopy=classes.slice();
$(“#开关”)。单击(函数(){
如果(!classesCopy.length){
classesCopy=classes.slice();
}//所有类用完后,将从头开始
var classToAdd=classesCopy.splice(Math.floor(Math.random()*classesCopy.length),1);
$('.current class').text('current class:'+classToAdd);
$(“#logo”).removeClass().addClass(classToAdd+”);
});
#徽标{
宽度:100px;
高度:100px;
背景:绿色;
}

转换

addClass()是否将同一个类添加两次?或者你是说你不想通过背靠背点击来尝试同一个类?将生成的数字保存到一个变量中,然后在while循环中第二次检查它,直到你得到另一个number@Taplar,我不希望同一个类一个接一个地添加两次,因为有时添加了相同的类,我们可以认为代码不是working@rubchick谢谢你的回复,你能帮忙吗?@mmdwc,请看下面的Taplar解决方案,这就是我所说的谢谢你的回复,但不幸的是它不起作用。。。我经常连续两次上同一门课。。。你知道为什么吗?真的吗?奇怪的因此,如果您在控制台.log()上显示下一个类编号,而您有时会看到相同的编号两次?谢谢您的帮助,但它不起作用。。。类不再改变…让我创建runnableversion@mmdwc看看你认为它工作得很好。。。我在一个函数中使用它,并在document.ready和其他onclick函数中调用该函数。我必须将var放在函数之外才能使它工作。谢谢!
//put it in an IIFE so the variables are scoped down
(function(){
    //constants, don't need to declare them in the click function over and over
    var classes = ["vert", "escalier","reverse","demi_escalier"
                   ,"demi_escalier_2","ligne" ];
    //keep track of the last class used, -1 initial so no chance of mismatch
    var lastNumber = -1;
    var $logo = $("#logo");

    $("#switch").on('click', function() {
        //get a new index
        var nextClass = Date.now() * 100 % classes.length;;

        //while they match, keep getting a new one
        while (nextClass === lastNumber) {
            nextClass = Date.now() * 100 % classes.length;
        }

        $logo.removeClass().addClass(classes[nextClass]);
        //save it off so we can do the double check again on the next execution
        lastNumber = nextClass;
    });
})();