div下拉框（待改善）

最新推荐文章于 2023-03-14 14:55:17 发布
anjiao5306
最新推荐文章于 2023-03-14 14:55:17 发布
阅读量98
点赞数
文章标签： java
原文链接：http://www.cnblogs.com/binggu/p/4087397.html
版权
不说话，直接上代码，其中函数dealchose（）没有实现，各位就不必纠结了
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'div下拉.jsp' starting page</title>
    
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">    
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="This is my page">
    <!--
    <link rel="stylesheet" type="text/css" href="styles.css">
    -->
    <script>
    
    function dealClick(){
    var reasonStr = document.getElementById("zsyy");   //需要弹出下拉列表的文本框
    var repairList = document.getElementById("reasons"); //要弹出的下拉列表
    var divClose = document.getElementById("tdClose");
    var reasonOptions = document.getElementsByName("zsyys"); //所有列表元素
    var zsyystr=new Array();//输入框填写的注塑原因
    zsyystr=reasonStr.value.split("；");
    var bNoAdjusted = true;
    
    for(var i=0;i<reasonOptions.length;i++){
        for(var j=0;j<zsyystr.length;j++){
            if(reasonOptions[i].value==zsyystr[j]){
                reasonOptions[i].checked=true;
            }
        }
    }
    divClose.onclick = function()
    {
        repairList.style.display = "none";
        if(reasonStr.value==''){
            reasonStr.value="单击文本框选择修模原因";
            reasonStr.style.color='#999999';
        }
    };
    //文本获得焦点时的事件
    reasonStr.onfocus = function()
    {    
           
        repairList.style.display = "block";
        if(reasonStr.value=="单击文本框选择修模原因"){
            reasonStr.value='';
            reasonStr.style.color='#000000';
        }else{
            reasonStr.style.color='#000000';
        }
        //reasonStr.style.color='#000';
        if (bNoAdjusted)
        {
            
            bNoAdjusted = false;
            //设置下拉列表的宽度和位置
            repairList.style.width =166;
            repairList.style.posTop = 40;
            repairList.style.posLeft = 118;
            
            
            
        }
    }
}
    
    
    </script>

  </head>
  
  <body>
   
   <table>
   <tr>              
                <td width="100" height="25" class="tableshortleftbg">注塑修模原因</td>              
                <td >
                <input type="text" onMouseDown="dealClick()" id="zsyy" name="zsyy" size="22" value="单击文本框选择修模原因" style="color: #999999" readonly="readonly" /> <font color="red">*</font>
                    <div id="reasons" style="display: none; border: 1px solid #000000; overflow: hidden; height: 150px; width: 50px; position: absolute; ">
                        <table width="100%" border="0" cellpadding="0" cellspacing="0">
                            <tr>
                                <td colspan="1" align="left" width="100px" style=" overflow: auto; height: 30px; background-color: #FFFFFF;">                                
                                    <input name="zsyys" type="checkbox" value="毛刺" onClick="dealChosen()">毛刺                                    
                                </td>
                                <td colspan="1" align="left" width="100px" style=" overflow: auto; height: 30px; background-color: #FFFFFF;">                                
                                    <input name="zsyys" type="checkbox" value="脱模剂" onClick="dealChosen()">脱模剂                                    
                                </td>
                                </tr>
                                <tr>
                                <td colspan="1" align="left" width="95px" style=" overflow: auto; height: 30px; background-color: #FFFFFF;">                                
                                    <input name="zsyys" type="checkbox" value="油污" onClick="dealChosen()">油污                                    
                                </td>
                            
                                <td align="left" style=" overflow: auto; height: 35px; background-color: #FFFFFF;">                            
                                    <input name="zsyys" type="checkbox" value="浇口"  onClick="dealChosen()">浇口                                    
                                </td>
                                </tr>
                                <tr>
                                <td align="left" style=" overflow: auto; height: 30px; background-color: #FFFFFF;" >                                
                                    <input name="zsyys" type="checkbox" value="机械手" onClick="dealChosen()">机械手                                    
                                </td>
                                <td align="left" style=" overflow: auto; height: 30px; background-color: #FFFFFF;">                                
                                    <input name="zsyys"  type="checkbox" value="变形" onClick="dealChosen()">变形                                    
                                </td>
                                
                            </tr>
                            
                            <tr>
                                <td colspan="3" align="left"  style=" overflow: auto; height: 30px; background-color: #FFFFFF;">                            
                                    <input name="zsyys" type="checkbox" value="修模不合格"  onClick="dealChosen()">修模不合格                                    
                                </td>
                                </tr>
                            
                            
                            <tr>
                                <td colspan="3"  height="30px" align="center" id="tdClose" style="cursor: hand; background-color:#CCCCCC;" ><b>关闭</b></td>
                            </tr>
                        </table>
                    </div>
                </td>                
                          
                <td class="tableshortleftbg">&nbsp;</td>
                <td width="100" class="tableshortleftbg">修模原因备注</td>
                <td><input type="text" name="yyrm" size=22 maxlength=50  ></td>
                <td class="tableshortleftbg">&nbsp;</td>
                <td width="100" class="tableshortleftbg">紧急程度</td>
                <td>
                    <input type="radio" name="jjcd" id="jj" size=22 maxlength=20 readonly="readonly " value="紧急"><span><b><font color="red">紧急</font></b></span>
                    <input type="radio" name="jjcd" id="fj" size=22 maxlength=20 readonly=" readonly" value="非紧急"><span><b><font color="red">非紧急</font></b></span>
                </td>
                <td class="tableshortleftbg">&nbsp;</td>
            </tr>
            </table>
   
   
   
   
  </body>
</html>