1 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
2 <%
3 String path = request.getContextPath();
4 String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
5 %>
6 <!DOCTYPE html>
7 <html>
8 <head>
9 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
10 <title>File Info</title>
11 <link rel="stylesheet" type="text/css" href="../jquery-easyui-1.4.1/themes/default/easyui.css">
12 <link rel="stylesheet" type="text/css" href="../jquery-easyui-1.4.1/themes/icon.css">
13 <link rel="stylesheet" type="text/css" href="../jquery-easyui-1.4.1/themes/color.css">
14 <link rel="stylesheet" type="text/css" href="../jquery-easyui-1.4.1/demo/demo.css">
15 <link rel="stylesheet" type="text/css" href="../css/info.css">
16 <script type="text/javascript" src="../jquery-easyui-1.4.1/jquery.min.js"></script>
17 <script type="text/javascript" src="../jquery-easyui-1.4.1/jquery.easyui.min.js"></script>
18 <script type="text/javascript" src="../jquery-easyui-1.4.1/locale/easyui-lang-zh_CN.js"></script>
19 <!-- <script type="text/javascript" src="../js/jquery-1.8.0.min.js"></script> -->
20 <script type="text/javascript" src="../js/Common.js"></script>
21 <style type="text/css">
22 .test_box {
23 width: 400px;
24 min-height: 120px;
25 max-height: 300px;
26 _height: 120px;
27 border:solid 1px blue;
28 outline:0;
29 }
30 .test_box p{ margin: 0; }
31 </style>
32 </head>
33 <body>
34 <!-- 显示文件信息的表格 -->
35 <!-- <table id="dg" class="easyui-datagrid" style="height: 470px;"
36 url="findAll.do"
37 toolbar="#toolbar" pagination="true"
38 rownumbers="true" fitColumns="true" singleSelect="true"
39 data-options="fit:false,border:false,pageSize:5,pageList:[5,10,15,20]" >
40 <thead>
41 <tr>
42 此处必须和实体类字段一致
43 <th field="filename" width="50">文件名</th>
44 <th field="filepath" width="50">文件路径</th>
45 <th field="updatedate" width="50">上传时间</th>
46 </tr>
47 </thead>
48 </table>
49 <table id="tdList"></table> -->
50 <script type="text/javascript">
51 var $jq = jQuery.noConflict();
52
53 function add() {
54 $jq("#add").dialog({
55 title : "添加数据字典类别",
56 collapsible : true,
57 minimizable : true,
58 maximizable : true,
59 resizable : true,
60 width : 400,
61 height : 260,
62 buttons : [ {
63 text : "保存",
64 iconCls : "icon-add",
65 handler : function() {
66 $jq("#add form").submit();
67 }
68 }, {
69 text : "取消",
70 iconCls : "icon-cancel",
71 handler : function() {
72 $jq("#add").dialog("close");
73 }
74 } ]
75 });
76 };
77
78 $jq(function () {
79 $jq("#tdList").datagrid({
80 url: "findAll.do",
81 title: "数据字典列表",
82 loadMsg: ‘正在加载信息...‘,
83 width: "100%",
84 idField: "Id",
85 fitColumns: true,
86 pagination: true,
87 pageSize: 10,
88 pageList: [10, 20, 35, 50],
89 singleSelect: true,
90 rownumbers: true,
91 columns: [[
92 { field: ‘filename‘, title: ‘文件名‘, width: 120 },
93 { field: ‘filepath‘, title: ‘文件路径‘, width: 80 },
94 {
95 field: ‘updatedate‘, title: ‘上传时间‘, width: 80,
96 formatter : formatterdate3
97 }
98
99 ]],
100 toolbar: [{
101 id: ‘add‘,
102 text: ‘添加‘,
103 iconCls: ‘icon-add‘,
104 handler: add
105 }],
106 onLoadSuccess: function (data) {
107 if (!data.rows) {
108 var body = $jq(this).data().datagrid.dc.body2;
109 body.find(‘table tbody‘).append(‘<tr><td width="‘ + body.width() + ‘" style="height: 25px; text-align: center;">没有数据</td></tr>‘);
110 }
111 }
112 });
113
114 // TODO
115 // 删除键
116 /* document.onkeydown = function(){
117 var oEvent = window.event;
118
119 if (oEvent.keyCode == 8) {
120 $jq(".test_box div:last").remove();
121 }
122 }
123 // 回车键
124 document.onkeydown = function(){
125 var oEvent = window.event;
126
127 if (oEvent.keyCode == 13) {
128 // 默认选中select下拉的第一个option
129 $jq("#test_select option:first").attr("selected",true);
130 // 让select整体聚焦
131 $jq("#test_select").focus();
132 }
133 } */
134 $jq("#select_div").hide();
135 $jq(".test_box").focus();
136 // 给.test_box绑定删除事件
137 $jq(".test_box").keydown(function(e){
138 var oEvent = window.event;
139 if (oEvent.keyCode == 8) {
140 $jq(".test_box div:last").remove();
141 }
142 });
143 // 给.test_box绑定回车事件
144 $jq(".test_box").bind("keydown",function(e){
145 var oEvent = window.event;
146 if (oEvent.keyCode == 13) {
147 // 执行一些操作-这里假设进行了一个ajax请求返回一个值，并把这个值加入到select中
148 var testValue="fuck999";
149 $jq("#test_select").append(‘<option value="fuck2">‘+testValue+‘</option>‘);
150 // 默认选中select下拉的第一个option
151 $jq("#test_select option:first").attr("selected",true);
152 // 让select整体聚焦
153 $jq("#select_div").show();
154 $jq("#test_select").focus();
155 }
156 });
157
158 $jq("#test_select").keydown(function(e){
159 var oEvent = window.event;
160 if (oEvent.keyCode == 13) {
161 // 默认选中select下拉的第一个option
162 $jq(this).attr("selected",true);
163 // 让select所在div隐藏
164 $jq(".test_box").append(‘<div style="display:block;margin:0 auto;background:gray;width:50px;float:left;">‘
165 +$jq("#test_select option:selected").val()+‘</div>‘);
166 alert("fuck");
167 $jq("#test_select").blur();
168 $jq("#select_div").hide();
169 }
170 });
171
172
173 });
174
175
176 </script>
177 <div class="test_box" contenteditable="true">
178 <div style="display:block;margin:0 auto;background:gray;width:50px;float:left;">
179 fuck1
180 </div>
181 <div style="display:block;margin:0 auto;background:gray;width:50px;float:left;">
182 fuck2
183 </div>
184 <div style="display:block;margin:0 auto;background:gray;width:50px;float:left;">
185 fuck3
186 </div>
187 <div style="display:block;margin:0 auto;background:gray;width:50px;float:left;">
188 fuck4
189 </div>
190 </div>
191 <div id="select_div">
192 <select id="test_select" multiple>
193 <option value="fuck1">fuck1</option>
194 <option value="fuck2">fuck2</option>
195 <option value="fuck3">fuck3</option>
196 <option value="fuck4">fuck4</option>
197 </select>
198 </div>
199
200 </body>
201 </html>
时间： 2024-10-18 07:57:08