div下拉框(待改善)
不说话,直接上代码,其中函数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"> </td>
<td width="100" class="tableshortleftbg">修模原因备注</td>
<td><input type="text" name="yyrm" size=22 maxlength=50 ></td>
<td class="tableshortleftbg"> </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"> </td>
</tr>
</table> </body>
</html>
div下拉框(待改善)的更多相关文章
- jquery div 下拉框焦点事件
这章与上一张<jquery input 下拉框(模拟select控件)焦点事件>类似 这章讲述div的焦点事件如何使用 div的焦点事件与input的焦点事件区别在于 需要多添加一个属性: ...
- jquery学习笔记:获取下拉框的值和下拉框的txt
<div class="form-group"> <select class="form-control" id="iv_level ...
- vue获取下拉框值
vue获取下拉框的值,用vue-modle,只有点击下拉框的值才会赋值到下拉框中,初始时下拉框没有数据,而改用$event就不会出现这样的问题,下面看代码以及图解: v-model解决方式: < ...
- 前端 HTML form表单标签 select标签 option 下拉框
<select></select> select里面通常跟option配合使用 <!DOCTYPE html> <html lang="en&quo ...
- JS Div滚动,下拉框添加属性,年月日下拉条
创建某一下拉菜单的项: str = str+"<option value='"+i+"'>"+i+"</option>&quo ...
- div自定义下拉框
因为原生的下拉框不能修改其属性,很难美化下拉框. 所以自己用div简单自定义了一下下拉框,想美化直接修改css即可 <!DOCTYPE html> <html lang=" ...
- 用div,ul,input模拟select下拉框
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...
- div模拟的下拉框特效
随笔- 4 文章- 0 评论- 0 ? <style type="text/css"> body, ul, li { margin: 0; padding: 0; fo ...
- div模拟的下拉框特效jquery
从网上找来的,感觉不错就拿来分享下 <style type="text/css"> body, ul, li { margin: 0; padding: 0; font ...
随机推荐
- 【转】Unity摄像机的使用二:摄像机的切换
http://blog.csdn.net/liujunjie612/article/details/45847877 我们接着上一篇博文继续研究摄像机,这篇我们说下Unity中摄像机的切换,说到切换, ...
- 【.NET MVC分页】.NET MVC 使用pagelist 分页
1.安装 2. 在NuGet程序包管理控制台 ,输入Install-Package PagedList.mvc 安装PagedList 和PageList.Mvc; 3. @{ Layout = nu ...
- 错误:支持“EFDbContext”上下文的模型已在数据库创建后发生更改。请考虑使用 Code First 迁移更新数据库(http://go.microsoft.com/fwlink/?LinkId
支持"EFDbContext"上下文的模型已在数据库创建后发生更改.请考虑使用 Code First 迁移更新数据库(http://go.microsoft.com/fwlink/ ...
- Hive 01 概述、安装配置
概述 数据仓库:是一个面向主题的.集成的.不可更新的.随时间不变化的数据集合,它用于支持企业或组织的决策分析处理. 数据仓库的结构和建立过程: 数据源 数据存储及管理 ETL Extract 提取 T ...
- BZOJ4540 [Hnoi2016]序列 【莫队 + ST表 + 单调栈】
题目 给定长度为n的序列:a1,a2,-,an,记为a[1:n].类似地,a[l:r](1≤l≤r≤N)是指序列:al,al+1,-,ar- 1,ar.若1≤l≤s≤t≤r≤n,则称a[s:t]是a[ ...
- windows系统部署springboot项目及绑定域名
http://note.youdao.com/noteshare?id=c3ccea255affd2c5d79231d67fa29103&sub=187AEEEA5CF34531A2C2315 ...
- LESS CSS使用方法 , CSS也能跟JS一样玩
本文转自 http://blog.csdn.net/xuyonghong1122/article/details/51986472 在使用CSS的时候,总会有这个想法 这个属性值老是重复写好烦 这个 ...
- MYSQL常用的Show命令笔记
1.查询数据库 SHOW DATABASES; 2.查询数据库中表 SHOW TABLES; SHOW TABLES FROM db; 3.查询表索引 SHOW INDEX FROM table 4. ...
- mvc filters
1.controller using System; using System.Collections.Generic; using System.Linq; using System.Web; us ...
- 从无序序列中求这个序列排序后邻点间最大差值的O(n)算法
标题可能比较绕口,简单点说就是给你一个无序数列A={a1,a2,a3……an},如果你把这个序列排序后变成序列B,求序列B中相邻两个元素之间相差数值的最大值. 注意:序列A的元素的大小在[1,2^31 ...