javascript在页面中动态显示隐藏控件

浏览：3028 类型：程序语言发布人：Mykame 发布日期：2010/6/28 11:57:33

给要动态显示隐藏的控件加上一个id或name，并根据初始状态是否需要显示加入style="display: none"属性。

在页面顶部加入如下js代码：

<script type="text/javascript">
function showTb1() {
document.getElementById("tb1").style.display='';
document.getElementById("tb2").style.display='none';
document.getElementById("tb3").style.display='none';
}

function showTb2() {
document.getElementById("tb1").style.display='none';
document.getElementById("tb2").style.display='';
document.getElementById("tb3").style.display='none';
}

function showTb3() {
document.getElementById("tb1").style.display='none';
document.getElementById("tb2").style.display='none';
document.getElementById("tb3").style.display='';
}
</script>

则可以利用onclick="showTb1()"调用不同的js函数。

注：不要用会引起页面重新载入的控件，如<h:commandButton/>之类的。