Question

我正在开发一个jquery应用程序。我有10个带引号的div。我正在尝试创建一个函数，它接受一个数字并随机显示10个div中的引号数10秒并隐藏div。然后再次重复该过程。我无法做到，请帮助我。这是我的代码：

$(document).ready(function(){

    var div_number = 4;
    var used_numbers = new Array();
    var todo = setInterval(showQuotes(),3000);

    function showQuotes(){
        used_numbers.splice(0,used_numbers.length);
        $('.quotes').hide();
        for(var inc = 0; inc<div_number; inc++) {
            var random = get_random_number();
            $('.quotes:eq('+random+')').show();
        }
        $('.quotes').fadeOut(3000); 
    }

    function get_random_number(){
        var number = randomFromTo(0,9);
        if($.inArray(number, used_numbers) != -1) {
            get_random_number();
        }
        else {
            used_numbers.push(number);
            return number;
        }
    }
    function randomFromTo(from, to){
       return Math.floor(Math.random() * (to - from + 1) + from);
    }
});

Answer 1

我所做的改变：

通过样式表隐藏.quotes
在setInterval（showQuotes，10000）和
在淡出引号之前添加.delay（）
Py的'return'已添加到get_random_number

http://jsfiddle.net/cMQdj/1/

更改过的JavaScript：

$(document).ready(function () {
    var div_number = 4;
    var used_numbers = new Array();
    showQuotes();
    var todo = setInterval(showQuotes, 10000);

    function showQuotes() {
        used_numbers.splice(0, used_numbers.length);
        $('.quotes').hide();
        for (var inc = 0; inc < div_number; inc++) {
            var random = get_random_number();
            $('.quotes:eq(' + random + ')').show();
        }
        $('.quotes').delay(6000).fadeOut(3000);
    }

    function get_random_number() {
        var number = randomFromTo(0, 9);
        if ($.inArray(number, used_numbers) != -1) {
            return get_random_number(); 
        } else {
            used_numbers.push(number);
            return number;
        }
    }
    function randomFromTo(from, to) {
        return Math.floor(Math.random() * (to - from + 1) + from);
    }
});

并添加到您的样式表中：

.quotes {display:none}

Answer 2

我没有测试所有内容，但我已经看到一个可能阻止你的点，get_random_number并不总是返回一个数字。为此，它应该是

function get_random_number(){
    var number = randomFromTo(0,9);
    if($.inArray(number, used_numbers) != -1)
        {
        return get_random_number();
        }
    else
        {
        used_numbers.push(number);
        return number;
        }
}

希望有所帮助。

使用jquery显示和隐藏几个随机div

2 个答案: