页面中指定内容的显示和隐藏
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><a id="link1" href="javascript:change();">显示</a>基本信息 </span>
11 <div id="content">内容</div>
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><a 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>
<a id="link1" href="javascript:toggle('content1','link1');">显示</a>基本信息
</span>
<div id="content1">内容</div>
if ($("#"+ targetId).css("display") == "none") {
$("#"+ targetId).show();
$("#"+ link).html("隐藏");
} else {
$("#"+ targetId).hide();
$("#"+ link).html("显示");
}
}
Eg:
<span>
<a id="link1" href="javascript:toggle('content1','link1');">显示</a>基本信息
</span>
<div id="content1">内容</div>
说明:targetId是要隐藏的div的id,link是要改变的点击内容