<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>验证系统实现探讨</title>
<script type="text/javascript">
function $(strId){
return document.getElementById(strId);
}function showOptionInput(){
var oBtn=$("btnDisplay");
var oDiv=$("div1");
if(oDiv.style.display=="block"){
oDiv.style.display="none";
oBtn.value="填写";
}else{
oDiv.style.display="block";
oBtn.value="取消";
}
}
</script>
</head>
<body>
<input type="button" id="btnDisplay" value="填写" onclick="showOptionInput()"/>
<div id="div1" style="width:300px;height:200px;border:1px solid red;display:none">
可选项1<input type="text" id="txtOpion1"/><br/>
可选项2<input type="text" id="txtOpion2"/><br/>
可选项3<input type="text" id="txtOpion3"/><br/>
</div>
</body>
</html>

解决方案 »

  1.   


      bang  ding ```
                       
               顺便        jf ```
      

  2.   

    解决了,谢谢黄昏的热心解答,还有f3135210的帮忙顶贴~~~ 
    代码如下,给同我一样的菜鸟看,呵呵、、、、、 
    function changeShow1(){ 
      var obj = document.getElementById('change') 
    var ifChange =  obj.innerText; 
    var reportT = document.getElementById('reportT'); 
    if (ifChange=="显示明细"){obj.innerText = "隐藏明细"; 
      for(var i=1;i <reportT.rows.length;i++){ reportT.rows[i].style.display="" } 
      }else{obj.innerText = "显示明细"; 
      for(var i=1;i <reportT.rows.length;i++){reportT.rows[i].style.display="none" } 
    } } 
    <TABLE id=reportT> 
      <tr> <td> <span onclick="javascript:changeShow1()" id="change" class=text1 style="cursor:hand">显示明细 </span> 
    </td> </tr> 
      <TR id="detail" style="display:none"> <TD>123 </TD> </TR> 
      <TR id="detail"style="display:none"> <TD>789 </TD> </TR> 
      <TR style="display"> <TD>合计 </TD> </TR> 
    </TABLE>