We Recommend

Pro JavaScript Techniques Pro JavaScript Techniques
Pro JavaScript Techniques is the ultimate JavaScript book for the modern web developer. It provides everything you need to know about modern JavaScript, and shows what JavaScript can do for your web sites. This book doesn't waste any time looking at things you already know, like basic syntax and structures.


Posted By

kyokutyo on 12/13/06


Tagged

show display hide Switch


Versions (?)


どれか1つだけを表示


Published in: JavaScript 


id="bar1"、id="bar2"、id="bar3"が存在する時 どれか1つだけを表示する。 id="bar*"はHTMLの方でstyle="display:none;"を初めから指定しておく。 hogehogeして.lengthで繰り返し回数変えたり。 えらい人ならできそう。 ついでにこんなに変数いらない?うまく書くとこんなに要らない気もする。

  1. /*
  2.  * last update 2006.12.06
  3.  * -------------------------------------------------
  4.  * "showhide"はどのバーを表示するかを決める関数です.
  5.  * "switchdis"は表示切替だけのための関数です.
  6.  * tbnum:TargetBarNumber
  7.  * tbname:TargetBarName
  8.  * tb:TargetBar
  9.  * cbname:ChangeBarName
  10.  * cb:ChangeBar
  11.  * bs:BarStatus
  12.  * bn:BarNumber
  13.  * s:nantonaku
  14.  * t:nantonaku
  15.  */
  16.  
  17. function showhide(tbnum) {
  18. var tbname, tb, cbname, cb, bs, bn, show, i;
  19. tbname = 'bar' + tbnum;
  20. tb = document.getElementById(tbname);
  21. for(i=1;i<4;i++){
  22. cbname = 'bar' + i;
  23. cb = document.getElementById(cbname);
  24. if(i==tbnum){
  25. switchdis(cbname);
  26. } else {
  27. cb.style.display = 'none';
  28. }
  29. }
  30. }
  31.  
  32. function switchdis(t){
  33. var s;
  34. s = document.getElementById(t);
  35. if(s.style.display=='none'){
  36. s.style.display = 'block';
  37. } else {
  38. s.style.display = 'none';
  39. }
  40. }

Report this snippet 

You need to login to post a comment.