purazumakoiの[はてなブログ]

技術メモから最近はライフログも増えてきてます。

ラジオボタンをクリックした時に対応したブロックを表示非表示

メニューは4つ、URLと外部URLは同じ欄を使う

$menuAry = array(
  0 => '基本',
  1 => 'PDFリンク',
  2 => 'URL',
  3 => '外部URL',
 );
<script src="js/jquery-1.3.2.min.js" type="text/javascript" language="javascript"></script>
<script language="JavaScript" type="text/javascript">
$(document).ready(function() {
 class_name = new Array("tBasic", "tPdf", "tUrl", "tUrl");

 $('#menuArea input').click(function() {
  val = $(this).val();
  for (i=0; i < class_name.length; i++) {
   if(i == val)  $("#"+class_name[i]).show();
   else $("#"+class_name[i]).hide();
    }
 });
 
});
</script>

html部分

<table id="tBasic">
内容
</table>
<table id="tPdf">
内容
</table>
<table id="tUrl">
内容
</table>

ブラウザの互換性は調べてないけど、なんならdivにすればよいだろう


あ、classじゃなくてidつかってるけど変数名がclass_nameだ^^;
まいっか