javascript - Hiding dynamically generated divs on 'Click Event' -
i working on project have created 4 divs dynamically, first "display:block". when click next, second div "display:block" , 1st, 3rd, 4th "display:none"; problem when click next button fast 2 times - 2 divs "display:block" , both seen on screen. have tried following code, fed of this. there way control show-hide of dynamically generated divs?
<script> /* first check 1 div must show on click of 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'); }); /* double check 1 div must show @ 1 time - failing */ 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>
if can me out of mess-of multiple display:block of dynamically genearted divs, glad! ;( have tried hide() , show() selected one. have tried still problem persists. dont know how other divs hide if new 1 gets blocked!
quick , untested. show unnecessary code. perhaps track down problem.
$(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(); // correct active child here html figure out how in case var child = ???; $('div.step').hide(); $(child).show(); } });
edited
Comments
Post a Comment