Question

我是jquery的绝对生物。我正在使用谷歌学习，但我找不到如何解决这个问题。

我连续显示一个按钮，但是当我没有更多的div显示时，我想隐藏显示按钮。

这是代码：

$('#show').on('click', function() {
    if (index + 1 > max) {
        // Here, I suppose, I need to hide the button
    } else {
        if (index < max - 1) {
            index++;
            $('.container > div:eq(' + index + ')').show();
        }

在这里你可以看到例子

http://jsfiddle.net/vcARq/

提前致谢并抱歉我的英语;）

Answer 1

基本上你需要在完成像这个

这样的功能的运行时这样做

var index = -1;
var max = $('.container > div').length;
$('#show').on('click', function() {
        if (index < max - 1) {
            index++;
            $('.container > div:eq(' + index + ')').show();
        }
}, function () {
$(this).hide();
});

这应该对你有用

Answer 2

您可以通过检查每次单击按钮时是否显示最后一个div来执行此操作。因此，如果显示最后一个div，它会隐藏按钮。这是代码：

    var index = -1;
var max = $('.container > div').length;
$('#show').on('click', function() {
    if (index + 1 > max) {
        // Do Nothing
    } else {
        if (index < max - 1) {
            index++;
            $('.container > div:eq(' + index + ')').show();
        }


    }
    if ($('div.hidden:last').css('display') != 'none'){
     $('#show').hide()   ;
    }
});

Answer 3

在迭代索引之后，检查2的回调函数内部的值减去.show()。这将导致预期的行为。它是-2的原因是因为您在-1而不是0开始了偏移。

var index = -1
var max = $('.container > div').length;
$('#show').on('click', function () {
    var $this = $(this);
    if (index < max) {
        index++;
        $('.container > div:eq(' + index + ')').show(0, function () {
            if (index > max - 2) {
                $this.hide();
            }
        });
    }
});

Fiddle.

Answer 4

我的情况（点击最长时间）只是调用.hide（）。这是我的简单建议：

var index = -1;
var max = $('.container > div').length;
$('#show').on('click', function() {
    if (--max<=0) {          //condition
        $('#show').hide();   //hide button
    } 
    index++;
    $('.container > div:eq(' + index + ')').show();
});

http://jsfiddle.net/vcARq/8/

Answer 5

如果你是jquery的新手，我非常感谢你的工作，勇敢和好的尝试你的代码几乎接近你想要的：

Here is JSFiddle

你需要这段代码：

var index = 0;
var max = $('.container > div').length;
$('#show').on('click', function() {
        if (index < max ) {

       $('.container > div:eq(' + index+')').show();
                index++;
             if (index >= max ) 
                 $(this).hide();
        }   
});

完成onclick show div后隐藏按钮

5 个答案: