页面中指定内容的显示和隐藏

1 单个表格中隐藏和显示  :     

View Code
 1 function change() {       
 2       content.style.display = 
 3       (content.style.display== "none")
 4       ? "block": "none";
 5       link1.innerText = 
 6      (content.style.display == "none")
 7       ? "显示" : "隐藏";
 8     }
 9 Eg:
10 <span><id="link1" href="javascript:change();">显示</a>基本信息 </span>
11 <div id="content">内容</div>

2 一个页面中有多个要显示和隐藏的内容:

View Code
function toggle(targetId, link) {        
     if ($("#"+ targetId).css("display") == "none") {
            $("#"+ targetId).show();
 
            $("#"+ link).html("隐藏");       
     } else {
            $("#"+ targetId).hide();
 
            $("#"+ link).html("显示");      
         }
    } 
Eg:
   <span>
     <id="link1" href="javascript:toggle('content1','link1');">显示</a>基本信息 
   </span>
<div id="content1">内容</div>

说明:targetId是要隐藏的div的id,link是要改变的点击内容

posted @ 2012-01-30 15:46  kingjust  阅读(873)  评论(0编辑  收藏  举报