Minor tweak to this javascript function?
Posted
by
RKS
on Stack Overflow
See other posts from Stack Overflow
or by RKS
Published on 2012-06-05T16:30:52Z
Indexed on
2012/06/05
16:40 UTC
Read the original article
Hit count: 184
JavaScript
I have a script that shows/hides used via onClick. I can get it to show/hide just fine, but I can't get it to show/'hide everything else'. So what I get is a bunch of open containers when I really want just the one.
Javascript:
<script>
function showfields(fields){
if(document.getElementById(fields).style.display=='none'){
document.getElementById(fields).style.display='block';
}
else{
document.getElementById(fields).style.display = 'none';
}
}
</script>
HTML:
<div id="hidden" class="steps" style="display: block;">
<div class="section" style="margin-right: 10px;">
<h2>Something</h2>
</div>
<button class="continue dropdown" id="showLink" onClick="showfields('hidden2');return false;" href="#">Continue</button>
</div>
<div id="hidden2" class="steps" style="display: block;">
<div class="section" style="margin-right: 10px;">
<h2>Something2</h2>
</div>
<button class="continue dropdown" id="showLink" onClick="showfields('hidden3');return false;" href="#">Continue</button>
</div>
<div id="hidden3" class="steps" style="display: block;">
<div class="section" style="margin-right: 10px;">
<h2>Something3</h2>
</div>
<button class="continue dropdown" id="showLink" onClick="showfields('hidden3');return false;" href="#">Continue</button>
</div>
<div id="hidden4" class="steps" style="display: block;">
<div class="section" style="margin-right: 10px;">
<h2>Something4</h2>
</div>
<button class="continue dropdown" id="showLink" onClick="showfields('hidden4');return false;" href="#">Continue</button>
</div>
Thanks
© Stack Overflow or respective owner