0

我正在尝试随机化一组 div 类，然后每次单击按钮时淡入不同的 div（事实）。但是，我不能工作的是如何每次显示一个完全不同的 div，以便在单击时不会重复一个 div。

我目前的代码是：

$(document).ready(function () {

    var facts = Array('.fact1', '.fact2');

    $(document).delegate('a.eggbutton', 'click', function () {

        $(fact).fadeOut('slow');

        var fact = facts[Math.floor(Math.random() * facts.length)];

        $(fact).fadeIn('slow');

    });

});
4

4 回答 4

3

希望这会有所帮助：http: //jsfiddle.net/AMmwL/6/

代码

function randomFact(){
    var factsArr = $(".fact");
    $(".fact").hide("slow");
    var rnd = Math.floor((Math.random()*(factsArr.length-1)));
    $(factsArr[rnd]).show("slow");
}
于 2013-06-12T12:15:19.127 回答
2

我认为您的问题是当您显示一个 div 时，您在显示另一个时并没有隐藏它。您确实尝试过这样做，$(fact).fadeOut('slow');但作为fact局部变量，它不会像您预期的那样工作。

作为第一个解决方案，您可以在全局范围内定义它，例如window.fact = ''

或者在显示到 div 时添加类，下次显示另一个 div 时，只需像下面一样隐藏它

$(".visibleDivClass").fadeOut('slow').removeClass("visibleDivClass");
...YOUR CODE...
$(fact).fadeIn('slow').addClass("visibleDivClass");
于 2013-06-12T12:10:50.773 回答
1

保证不会两次生成相同值的一种方法是保留最后生成值的日志，并在生成相同值时生成另一个值。简单地：

$(document).ready(function () {

    var facts = Array('.fact1', '.fact2');

    var currentValue = 0;

    $(document).delegate('a.eggbutton', 'click', function () {

        $(fact).fadeOut('slow');

        var newValue = 0;

        while(newValue == lastValue){
            newValue = Math.floor(Math.random() * facts.length);
        }
        currentValue = newValue; 

        var fact = facts[currentValue];

        $(fact).fadeIn('slow');
    });
});

这将保证相同的事实不会显示两次，并且均匀随机生成器将保证大部分均匀分布。

于 2013-06-12T12:39:09.560 回答
0

怎么样做类似的事情：

var arrayIndex = 0;

$(document).ready(function() {

    var facts = Array('.fact1','.fact2');

    $(document).delegate('a.eggbutton', 'click', function(){ 

    $(fact).fadeOut('slow');

    arrayIndex++;
    if (arrayIndex % facts.length == 0) shuffle(array);

    var fact = facts[arrayIndex % facts.length];

    $(fact).fadeIn('slow');

});

我假设您可以找到 javascript 的 suffle 方法，但可以在这里找到：

我怎样才能洗牌一个数组？

这种方法的一个问题是你仍然可以在洗牌后得到相同的“随机”数字，但你可以通过做进一步随机化它（伪代码如下）：

while (randomNumberForIndexBeforeShuffle == randomNumberForIndexAfterShuffle) {
   arrayIndex++;
   re-calculate randomNumberForIndexAfterShuffle
}
于 2013-06-12T12:09:49.820 回答