JQuery вы можете показать другой элемент при каждом последующем щелчке?

У меня есть очень простая идея ... есть кнопка (class = "upload"), которая при каждом последующем щелчке, я хочу, чтобы он показывал новый div, для набора максимально допустимого количества раз.JQuery вы можете показать другой элемент при каждом последующем щелчке?

Например:

$('.upload').click(function() { 
      $('.upload_block2').show(0); 
     }, function() { 
      $('.upload_block3').show(0); 
     }, function() { 
      $('.upload_block4').show(0); 
     }, function() { 
      $('.upload_block5').show(0); 
      $('.upload').hide(0); 
     });

Очевидно, что приведенный выше код не работает ...

это вообще возможно ли?

источник

2016-07-22 Scott

Вы можете использовать счетчик. Пока страница не обновляется, ее следует сохранить. Не уверен, что вы хотите, чтобы он сохранялся через обновления страниц. – Thecor

@ Thecor не нужно постоянно обновлять страницы ... могу ли я спросить, как будет выглядеть счетчик? Я пробовал один, но неудачно провалился – Scott

Moishe разместил его ниже. Это должно сработать. Однако, если вы хотите, чтобы он вернулся к первой загрузке после 5, вам нужно будет проверить для cutrentblock = 5, а затем установить set currentblock обратно на 1. – Thecor

Объявите две глобальные переменные, одну для общего количества отображаемых блоков, другую для текущего отображаемого блока.

Когда нажата кнопка .upload, проверьте currentBlock < maxBlock. Если это так, увеличьте текущий блок, который должен быть показан, и соедините .upload_block с currentBlock, чтобы получить селектор jquery.

var maxBlock = 5; 
var currentBlock = 1; 
$('.upload').click(function() { 
    if(currentBlock < maxBlock) { 
     currentBlock ++; 
     $('.upload_block' + currentBlock).show(0); 
    } 
});

источник

2016-07-22 05:28:20

Amazing !!!!!! Спасибо! – Scott

Попробуйте это:

var count = 1; 
$('.upload').click(function(){ 
    $(body).append('<div id="Div'+count+'"></div>'); 
    count++; 
});

Это добавит новую Див каждый раз с уникальным идентификатором тоже.

источник

2016-07-22 05:30:26

Я надеюсь, что это сработает для вас.

$('.upload').toggle(function() { 
     $('.upload').hide(0); 
     $('.upload_block2').show(0); 
    }, function() { 
     $('.upload').hide(0); 
     $('.upload_block3').show(0); 
    }, function() { 
     $('.upload').hide(0); 
     $('.upload_block4').show(0); 
    }, function() { 
     $('.upload').hide(0); 
     $('.upload_block5').show(0); 
});

Refere: http://www.w3schools.com/jquery/event_toggle.asp

источник

2016-07-22 05:43:45

Я думаю, что эта логика лучше всего, b'coz вы можете обрабатывать разную логику в каждой функции, если хотите –

JQuery вы можете показать другой элемент при каждом последующем щелчке?

ответ

Смежные вопросы