`
冽豹之姿
  • 浏览: 40310 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

js控制显示

    博客分类:
  • js
阅读更多
1 第一种:

<!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=gb2312" />
<title>无标题文档</title>
</head>
<script language="javascript">
function showv()
{
      var tr1=document.getElementById("tr1");
   tr1.style.display="";
   var sobj=document.getElementById("sv");
   alert(sobj.value);
   var optionsv="";
   for(k=0;k<sobj.options.length;k++)
   {
      optionsv=optionsv+","+sobj[k].value;
   }
   alert(optionsv);
}
</script>
<body>
<table width="200" border="1" align="center">
<tr>
    <td><input type="button" onclick="showv()" value="列表的值给我出来"/></td>
</tr>
<tr id="tr1" style="display:none">
    <td>
   <select name="sv" id="sv">
     <option value="A">111</option>
     <option value="B">222</option>
     <option value="C">333</option>   
   </select>
</td>
</tr>
</table>
</body>
</html>

2 第二种:

<!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=gb2312" />
<title>无标题文档</title>
</head>
<script language="javascript">
function showv()
{
      var tr1=document.getElementById("tr1");
   tr1.style.display="";
   var sobj=document.getElementById("sv").value;
   alert("你选择的是:"+sobj);
}
</script>
<body>
<table width="200" border="1" align="center">
<tr>
    <td><input type="button" onclick="showv()" value="列表的值给我出来"/></td>
</tr>
<tr id="tr1" style="display:none">
    <td>
   <select name="sv" id="sv">
     <option value="A">111</option>
     <option value="B" selected="selected">222</option>
     <option value="C">333</option>   
   </select>
</td>
</tr>
</table>
</body>
</html>
3 第三种:

<tr id="orgattr"   style="">
                            <td align="center"><span class="style2">属性</span></td>
                            <td >
                               <select name="orgattribute" onchange="oldsubdeptcodeshowcotrol()">
                                <option value="J">aaa</option>
                                <option value="Y">bbb</option>                               </select>
                            </td>           
                            <td align="center" id="old1"><span class="style2">名称</span></td>
                            <td id="old2">
                               <input type="text" name="oldsubdeptcode" maxlength="5" onpaste="return false"
                                onkeypress="return (event.keyCode>=48&&event.keyCode<=57)||(event.keyCode>=65&&event.keyCode<=90)||(event.keyCode>=97&&event.keyCode<=122)"
           style="ime-mode:disabled"
                               />
                            </td>
                            </tr>

---名称输入框只允许输入字母和数字。

    只有当属性为J时,名称输入框才显示。

js控制:

function oldsubdeptcodeshowcotrol(){
var selectType=document.getElementById("orgattribute").value;
var old1=document.getElementById("old1");
var old2=document.getElementById("old2");
if(selectType=="J"){
   old1.style.display="";
   old2.style.display="";
}else{
   old1.style.display="none";
   old2.style.display="none";
}

}

function setInput()
{
var selectType=document.all.orgtype.value;
var orgattribute=document.getElementById("orgattr");
//alert(selectType);
if(selectType=="4")
{
   orgattribute.style.display="";
}
else
{
   orgattribute.style.display="none";
}
}

setinput方法在jsp加载和前面一个列表的onchange事件时调用。


分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics