点击单选按钮显示对应内容

记录。

代码：

<table width="80%" border="1" align="center">
  <tr>
    <td align="right">组队方式：</td >

    <td colspan="3">  
      <input id="Radio1" name="team" type="radio" checked="checked"/>学校组队
      <input id="Radio2" name="team" type="radio" />模联协会组队
      <input id="Radio3" name="team" type="radio" />个人报名组队
    </td>
  </tr>
  <tr>
    <td colspan="3">

      <div id="div1">
        <table>
          <tr>
            <td align="right">参赛学生姓名： <td colspan="3"><input type="text" name="StuName" id="StuName" /></td>
            </tr>
            <tr>
              <td align="right">学校名称：</td>
              <td colspan="3"><input type="text" name="SchoolName" id="SchoolName" /></td>
            </tr>
            <tr>
              <td align="right">所在班级：</td>
              <td colspan="3"><input type="text" name="ClassName" id="ClassName" /></td>
            </tr>
          </table>
        </div>
        <div id="div2" style="display: none;">
          <table>
            <tr>
              <td align="right">父亲/母亲手机号：</td>
              <td colspan="3"><input type="text" name="ParentPhone" id="ParentPhone" /></td>
            </tr>
            <tr>
              <td align="right">领队老师：</td>
              <td colspan="3"><input type="text" name="LeaderName" id="LeaderName" /></td>
            </tr>
          </table>
        </div>

        <div id="div3" style="display: none;">
          <table>
            <tr>
              <td align="right">模联协会负责人：</td>
              <td colspan="3"><input type="text" name="ZRName" id="ZRName" /></td>
            </tr>
          </table>
        </div>
      </td>
    </tr>
    <tr>
      <td align="right">手机号：</td>
      <td><input type="text" name="Phone" id="Phone" /></td>
    </tr>
    <tr>
      <td align="right">E-mail：</td>
      <td><input type="text" name="Email" id="Email" /></td>
    </tr>

    <tr>

      <td colspan="2" align="center">
        <input type="submit" name="submit" id="submit" value="提交" />
        <input type="reset" name="reset" id="reset" value="重置" />
      </td>
    </tr>
  </table>
复制代码

脚本：

<script type="text/javascript">
$(function () {
  $(":radio").click(function () {
    if (this.checked) {
    if ($(this).attr("id") == "Radio1") {
    $("#div1").show();
    $("#div2").hide();
    $("#div3").hide();
    }
    if ($(this).attr("id") == "Radio2") {
    $("#div1").hide();
    $("#div2").show();
    $("#div3").hide();
    }
    if ($(this).attr("id") == "Radio3") {
    $("#div1").hide();
    $("#div2").hide();
    $("#div3").show();
    }
    }
    });
  });
</script>
复制代码