Скрывать динамически сгенерированные divs в 'Click Event'

Я работаю над проектом, в котором я создал 4 divs динамически, сначала в качестве «display: block». Когда я нажимаю дальше, я получу второй div как «display: block» и 1st, 3rd, 4th as «display: none»; Проблема в том, что я быстро нажимаю на следующую кнопку 2 раза - 2 divs получают «display: block», и обе они видны на экране. Я пробовал следующий код, но я устал от этого. Есть ли способ контролировать show-hide динамически генерируемых div?Скрывать динамически сгенерированные divs в 'Click Event'

<script> 

/* First check up that only one div must show on click of my 4 clickable buttons - failed .. ;(*/ 

     $(document).ready(function(){ 
      $('span#backPage').click(function(){ 
       var alpha1 = $('div.ui-formwizard-content').css('display','block'); 
       $('div.ui-formwizard-content').css('display','none'); 
       alpha1.css('display','block'); 
      }); 
      $('span#nextPage').click(function(){ 
       var alpha1 = $('div.ui-formwizard-content').css('display','block'); 
       $('div.ui-formwizard-content').css('display','none'); 
       alpha1.css('display','block'); 
      }); 
      $('span#prevField').click(function(){ 
       var alpha1 = $('div.ui-formwizard-content').css('display','block'); 
       $('div.ui-formwizard-content').css('display','none'); 
       alpha1.css('display','block'); 
      }); 
      $('span#nextField').click(function(){ 
       var alpha1 = $('div.ui-formwizard-content').css('display','block'); 
       $('div.ui-formwizard-content').css('display','none'); 
       alpha1.css('display','block'); 
      }); 

/* This is double check that only 1 div must show at one time - but failing too */ 

      if($('div#step_0').css('display','block')){$('div.step').css('display','none');$(this).css('display','block');} 

      if($('div#step_1').css('display','block')){$('div.step').css('display','none');$(this).css('display','block');} 

      if($('div#step_2').css('display','block')){$('div.step').css('display','none');$(this).css('display','block');} 

      if($('div#step_3').css('display','block')){$('div.step').css('display','none');$(this).css('display','block');} 

     }); 

    </script>

Если кто-то может помочь мне из этого беспорядка-множественного отображения: блок динамически genearted дивы, я был бы рад! (Я попробовал скрыть() для всех и показать() для выбранного. Я пробовал все, но проблема осталась. Я не знаю, как заставить всех остальных скрыть, если новый заблокирован!

источник

2015-04-29 Deadpool

добавить HTML, пожалуйста, – Ted

Похоже, вы делаете '$ ('div.ui-Мастер форм -content '). css (' display ',' block '). css (' display ',' block '); 'с var alpha 1. Мне обычно нравится использовать' .show() 'и' .hide() ' вместо '.css ('d isplay ',' none '); 'также – sareed

Похоже, вы настраиваете отображение на блок, а затем на none, а затем на блок для элемента. Может быть, просто '$ ('div.ui-formwizard-content'). Show();'? – sareed

Quick и не тестировалась. в основном, чтобы показать свой ненужный код. Может быть, это поможет вам отследить вашу проблему.

$(document).ready(function(){ 
     $('span#backPage').click(function(){ 
      showAlpha(this); 
     }); 
     $('span#nextPage').click(function(){ 
      showAlpha(this); 
     }); 
     $('span#prevField').click(function(){ 
      showAlpha(this); 
     }); 
     $('span#nextField').click(function(){ 
      showAlpha(this); 
     }); 

     function showAlpha(_this) { 
      var alpha1 = $('div.ui-formwizard-content'); 
      alpha1.show(); 
      // Get the correct active child here html would help figure out how in your case 
      var child = ???; 
      $('div.step').hide(); 
      $(child).show(); 
     } 

    });

Отредактировано

источник

2015-04-29 16:13:35 sareed

Скрывать динамически сгенерированные divs в 'Click Event'

ответ

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