function outband(){
var iob = document.getElementsByName('isOutbandOpen'); // 此处获得是你radio定义的name
var lbt = document.getElementsByName('loadBalanceType'); //
alert("welcome--- 隐藏");
//outband隐藏
//对获取到得radio数组进行遍历
for ( var v = 0 ; v < iob.length; v++) {
alert("----outband--" + iob[v].value);
//判断次radio是否被选中
if ( iob[v].checked ){
alert("-----outband被选中--" + iob[v].value);
//iob[v]这样获取的是一个对象类型
//iob[v].value这样获取的是这个对象的value值
if ( iob[v].value == 'N' ){ //不知道此处N为什么用成双引号就不对了
alert("------outband等于-----N-----");
document.all("outband_tr").style.display='none'; //设置为隐藏
document.all("outband_button").style.display='none';
//document.all("outband_tr").style.visibility = "hidden";
//document.all("outband_button").style.visibility = "hidden"
}
if( iob[v].value == 'Y' ){
document.all("outband_tr").style.display='inline'; //设置为显示
document.all("outband_button").style.display='inline';
//document.all("outband_tr").style.visibility = "visible";
//document.all("outband_button").style.visibility = "visible";
}
break;
}
}
//AS负载分担方式隐藏
for ( var d = 0 ; d < lbt.length ; d++ ){
alert("loadBalanceType---进入循环 -- " + lbt[d].value);
if ( lbt[d].checked ){
if ( lbt[d].value == '1'){
alert("loadBalanceType--- = 1 = true --值 : " + lbt[d].value);
document.all("numberRoute_tr").style.display='none'; //设置为隐藏
document.all("numberRoute_button").style.display='none';
//document.all("numberRoute_tr").style.visibility = "hidden";
//document.all("numberRoute_button").style.visibility = "hidden";
alert("===1 执行完毕");
}
if( lbt[d].value == '0' ) {
alert("loadBalanceType--- = 0 = true -- 值 : " + lbt[d].value);
document.all("numberRoute_tr").style.display='inline'; //设置为显示
document.all("numberRoute_button").style.display='inline';
//document.all("numberRoute_tr").style.visibility = "visible";
//document.all("numberRoute_button").style.visibility = "visible";
alert("===0 执行完毕");
}
break;
}
}
displayCaller();
}
这是js的代码..
然后再每个radio上触发onclick事件
PS:
注意:这句话
var iob = document.getElementsByName("xx");
注意这个S一定要加上 因为获取的是一个数组
关于的 style.visibility 和 style.display两个的区别 :
一:
web页面前台编码时经常用到display:none样式,平常使用时发现有几点特征需要注意
1、如果在样式文件或页面文件代码中直接用display:none对元素进行了隐藏,载入页面后,在没有通过js设置样式使元素显示的前提下,使用js代码会无法正确获得该元素的一些属性,比如offSetTop,offSetLeft等,返回的值会为0,通过js设置style.display来使元素显示后才能正确获得这些值。
2、使用display:none隐藏的元素不会被百度等搜索网站检索,会影响到网站的SEO,某些情况下可以使用left:-100000px来达到同样效果。
3、如果是通过样式文件或<style>css</style>方式来设置元素的display:none样式,用js设置style.display=""并不能使元素显示,可以使用block或inline等值来代替。通过style="display:none"直接在元素上进行的设置不会有这个问题
4、有些情况下可以使用style.visibility来代替style.display,但是要注意的是style.visibility隐藏元素时会保留元素在页面上所占的空间,而style.display隐藏元素且让出所占页面空间。
二、display:none和visible:hidden都能把网页上某个元素隐藏起来,但两者有区别:display:none ---不为被隐藏的对象保留其物理空间,即该对象在页面上彻底消失,通俗来说就是看不见也摸不到。visible:hidden--- 使对象在网页上不可见,但该对象在网页上所占的空间没有改变,通俗来说就是看不见但摸得到。
例如这样的
<table>
<tr id="xx">我想藏得东东</tr>
是:<input type="radio" name="test" id="test" value="1" οnclick="事件名();">
否:<input type="radio" name="test" id="test" value="0" οnclick="事件名();">
</table>