回车键转tab键解决方案二
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script src="js/jquery-1.5.2.js" type="text/javascript"></script>
<script type="text/javascript">
var companyID='${request.companyID}';
var tabObj = new TabObj("input_type2");
var enterFunc =function(e){
var key = e.which;
var index = -1;
var item = null;
if(key==13){
/* if (this.id == "ticketNo"){
if ($("#addAtOnce")[0].checked == true){
saveRecord();
}
} */
if (this.id == "fastAdd"){
saveRecord();
} else {
/* index= $input.index(this)+1; */
item = getNextInput(this);
}
/* if(index==4){
$("#butt").submit();
index=0;
}*/
} else if(key==38){
if (this.nodeName != "SELECT"){
item = getPrevInput(this);
}
/* index= $input.index(this) - 1; */
} else if(key==40){
if (this.nodeName != "SELECT"){
item = getNextInput(this);
}
/* index= $input.index(this) + 1; */
}
if (item != null){
e.preventDefault();
item.focus();
item.select();
/* $("input:eq("+index+")").focus();
$("input:eq("+index+")").select(); */
}
}
var dblClickFunc =function(){
var id = this.id;
if (id == "lbl_gTable"){
revertInputStyle("weight");
revertInputStyle("length");
revertInputStyle("width");
revertInputStyle("height");
} else{
var inputID = id.substr(4);
if (document.getElementById(inputID).disabled==true){
document.getElementById(inputID).disabled = false;
}else{
document.getElementById(inputID).disabled = true;
}
}
}
$(document).ready(function(){
/* $("#addAtOnce").click(function(){
disableInput($("#addAtOnce")[0].checked);
}); */
$("#ticketNo").focus(function(){
});
$("#ticketNo").blur(function(){
$.post("getPackageByTicketNo.action", {
ticketNo : $("#ticketNo").val()
}, function(data) {
var jsonObj = eval("(" + data + ")");
if (jsonObj.length == 1) {
/* load package information */
$("#customerNo").val(jsonObj[0].customerNo);
$("#senderAddress").val(jsonObj[0].senderAddress);
$("#receiverAddress").val(jsonObj[0].receiverAddress);
$("#count").val(jsonObj[0].count);
$("#remark").val(jsonObj[0].remark);
/* only use the first row to load data from KDBund */
refreshTable(1);
/* add information to row 1, and clear other rows */
refreshTable(jsonObj[0].count);
var cells = document.getElementById('gTable').rows[1].cells;
cells[1].innerHTML = "<td align='center'><input name='weight' value = " + jsonObj[0].weight + " style='width: 120px;' class='InputType'></td>";
cells[2].innerHTML = "<td align='center'><input name='length' value = " + jsonObj[0].length + " style='width: 120px;' class='InputType'></td>";
cells[3].innerHTML = "<td align='center'><input name='width' value = " + jsonObj[0].width + " style='width: 120px;' class='InputType'></td>";
cells[4].innerHTML = "<td align='center'><input name='height' value = " + jsonObj[0].height + " style='width: 120px;' class='InputType'></td>";
} else {
initContent();
}
getCustomerName();
});
});
$("#customerNo").blur(function(){
getCustomerName();
});
$("#count").blur(function(){
var number = parseInt($("#count").val());
refreshTable(number);
});
/* $("#fastAdd").click(function(){
saveRecord();
}); */
})
function saveRecord(){
var weights = getListData("weight");
var lengths = getListData("length");
var widths = getListData("width");
var heights = getListData("height");
$.post("fastAddPackage.action", {
ticketNo : $("#ticketNo").val(),
customerNo : $("#customerNo").val(),
senderAddress : $("#senderAddress").val(),
receiverAddress : $("#receiverAddress").val(),
expressType : $("#expressType").val(),
sort : $("#sort").val(),
payType : $("#payType").val(),
senderAddress : $("#senderAddress").val(),
count : $("#count").val(),
weights : weights,
lengths : lengths,
widths : widths,
heights : heights,
remark : $("#remark").val()
}, function(data) {
var jsonObj = eval("(" + data + ")");
if (jsonObj.result == "true") {
initContent();
$("#ticketNo").val("");
$("#ticketNo").focus();
}
});
}
$(function(){
$("#ticketNo").focus();
registerEnterFunc();
$label = $("label");
$label.bind("click",dblClickFunc);
});
function registerEnterFunc(){
/*$input = $("input");
$input.bind("keydown",enterFunc); */
$input = document.getElementsByClassName("InputType");
for (var i = 0; i < $input.length; i++){
$input.item(i).addEventListener("keydown",enterFunc);
}
}
function getNextInput(current){
var item = null;
var start = false;
for (var i = 0; i < $input.length; i++){
if (start == true){
if ($input.item(i).disabled == false){
item = $input.item(i);
break;
}
}else if ($input.item(i) == current){
start = true;
}
}
return item;
}
function getPrevInput(current){
var item = null;
var stop = false;
for (var i = 0; i < $input.length; i++){
if ($input.item(i) == current){
stop = true;
break;
} else if (stop == false){
if ($input.item(i).disabled == false){
item = $input.item(i);
}
}
}
return item;
}
function getCustomerName(){
$.post("getCustomerName.action", {
customerNo : $("#customerNo").val()
}, function(data) {
var jsonObj = eval("(" + data + ")");
document.getElementById("customerName").innerHTML = jsonObj.customerName;
});
}
function disableInput(flag){
if (flag == true){
$("#fastAddForm table").find("tr:gt(1)").find("td:eq(1)").children().attr("disabled","disabled");
$("#fastAddForm table").find("tr:last").find("td").children().attr("disabled","disabled");
$("#fastAddForm table").find("tr:eq(9)").find("td").find("table tr:eq(1)").find("td:gt(0)").children().attr("disabled","disabled");
} else {
$("#fastAddForm table").find("tr:gt(1)").find("td:eq(1)").children().attr("disabled",false);
$("#fastAddForm table").find("tr:last").find("td").children().attr("disabled", false);
$("#fastAddForm table").find("tr:eq(9)").find("td").find("table tr:eq(1)").find("td:gt(0)").children().attr("disabled",false);
}
}
function getListData(name){
var weights = document.getElementsByName(name);
var data = "";
for (var i = 0; i < weights.length; i++){
data = data + weights.item(i).value;
if (i < weights.length - 1){
data = data + ",";
}
}
return data;
}
function revertInputStyle(name){
var elements = document.getElementsByName(name);
var current = elements.item(0).disabled;
for (var i = 0; i < elements.length; i++){
if (current==true){
elements.item(i).disabled = false;
}else{
elements.item(i).disabled = true;
}
}
}
function refreshTable(number) {
var table = document.getElementById("gTable");
if (number > 0 && number < 100) {
/* remove the rows if the number is changed to small */
for (var i = table.rows.length - 1; i > number; i--) {
table.deleteRow(i);
}
/* add the rows if the number is changed to large */
for (var i = table.rows.length - 1; i < number; i++) {
var tr = "<tr>";
tr = tr + "<td>" + (i + 1) + "</td>";
tr = tr + "<td align='center'><input name='weight' value = '0' style='width: 120px;' class='InputType'></td>";
tr = tr + "<td align='center'><input name='length' value = '0' style='width: 120px;' class='InputType'></td>";
tr = tr + "<td align='center'><input name='width' value = '0' style='width: 120px;' class='InputType'></td>";
tr = tr + "<td align='center'><input name='height' value = '0' style='width: 120px;' class='InputType'></td>";
tr = tr + "</tr>";
$("#gTable").append(tr);
}
registerEnterFunc();
}
}
function initContent(){
/* initialize all text */
$("#count").val("1");
$("#remark").val("");
refreshTable(1);
/* var cells = document.getElementById('gTable').rows[1].cells;
cells[1].innerHTML = "<td align='center'><input name='weight' value = '1' style='width: 120px;'></td>";
cells[2].innerHTML = "<td align='center'><input name='length' value = '1' style='width: 120px;'></td>";
cells[3].innerHTML = "<td align='center'><input name='width' value = '1' style='width: 120px;'></td>";
cells[4].innerHTML = "<td align='center'><input name='height' value = '1' style='width: 120px;'></td>";
*/ }
function TabObj(className) {
this.ele = $("." + className);
this.next = next;
}
function next(unit) {
var tmp = this.ele;
$.each(this.ele, function(index, element) {
if (this == unit) {
if (tmp.length > index + 1)
tmp[index + 1].focus();
else
tmp[0].focus();
return false;
}
});
}
function changeEnter() {
if (event.keyCode == 13) {
event.keyCode = 9;
}
};
</script>
<head>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>快速录入</title>
<style type="text/css">
.tdLabel{text-align:right;}
</style>
</head>
<body>
<form id="fastAddForm">
<table style="width: 700px;" class="table table-striped table-bordered table-hover"
border=1 align="center" cellpadding=0 cellspacing="1">
<tr bgcolor="#e1e1e1">
<td colspan="2" style="text-align: center;">快速录入<!-- <input type = "checkbox" id="addAtOnce" > 扫描单号立即录入 --></td>
</tr>
<tr>
<td>单号:</td>
<td><input name="ticketNo" id="ticketNo" class="InputType"></td>
</tr>
<div name = "context" onselectstart=" return false">
<tr>
<td><label id="lbl_customerNo">客户编号:</label></td>
<td><input name="customerNo" id="customerNo" class="InputType"> <span id = "customerName"></span> </td>
</tr>
<tr>
<td><label id="lbl_expressType">快递类别:</label></td>
<td> <select style="width: 150px; height: 35px;"
class="InputType" id="expressType" name="expressType" >
<option value="LDX日本线">LDX日本线</option>
<option value="LDX韩国线">LDX韩国线</option>
<option value="LDX国际快递">LDX国际快递</option>
<option value="LDX国内快递">LDX国内快递</option>
<option value="国内EMS">国内EMS</option>
</select></td>
</tr>
<tr>
<td><label id="lbl_sort">货物类型:</label></td>
<td> <select style="width: 150px; height: 35px;"
class="InputType" id="sort" name="sort">
<option value="0">文件</option>
<option value="1" selected="selected">包裹</option>
<option value="2">防水袋</option>
</select></td>
</tr>
<tr>
<td><label id="lbl_payType">付款方式:</label></td>
<td> <select style="width: 150px; height: 35px;"
class="InputType" id="payType" name="payType">
<option value="0">现付</option>
<option value="1">到付</option>
<option value="2" selected="selected">月结</option>
</select></td>
</tr>
<tr>
<td><label id="lbl_senderAddress">寄件人地址:</label></td>
<td><input name="senderAddress" id="senderAddress" class="InputType"></td>
</tr>
<tr>
<td><label id="lbl_receiverAddress">收件人地址:</label></td>
<td><input name="receiverAddress" id="receiverAddress" class="InputType"></td>
</tr>
<tr>
<td><label id="lbl_count">件数:</label></td>
<td><input name="count" id="count" value = "1" class="InputType"></td>
</tr>
<tr>
<td colspan="2"><label id="lbl_gTable">货物信息</label></td>
</tr>
<tr>
<td colspan="2">
<table id="gTable"
class="table table-striped table-bordered table-hover" style="table-layout:fixed;width: 700px;"
border=1 align="center" cellpadding="0" cellspacing="1">
<tr style="height:0;">
<th style="width: 100px;">序号</th>
<th style="width: 150px;">重量</th>
<th style="width: 150px;">体积:长</th>
<th style="width: 150px;">宽</th>
<th style="width: 150px;">高</th>
</tr>
<tr>
<td>1</td>
<td align="center"><input name="weight" value = "1" style="width: 120px;" class="InputType"></td>
<td align="center"><input name="length" value = "1" style="width: 120px;" class="InputType"></td>
<td align="center"><input name="width" value = "1" style="width: 120px;" class="InputType"></td>
<td align="center"><input name="height" value = "1" style="width: 120px;" class="InputType"></td>
</tr>
</table>
</td>
</tr>
<tr>
<td><label id="lbl_remark">备注:</label></td>
<td><textarea name="remark" id="remark" style="width: 400px; height: 100px;" class="InputType"></textarea></td>
</tr>
<tr>
<td colspan="2" style="text-align: center;"><input type="button" id = "fastAdd" value="确定" onclick="return saveRecord();" class="InputType"></td>
</tr>
</div>
</table>
</form>
</body>
</html>
回车键转tab键解决方案二的更多相关文章
- 回车键转tab键解决方案一
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...
- 使用回车键代替TAB键 需jquery1.4.2版本
1 $(document).ready(function () { 2 $(':input:text:first').focus(); 3 $(':input:enabled').addClass(' ...
- 将回车键转tab键
//功能:将回车键转tab键$(function () {$('input:text:first').focus();var $enter = $("input[type=text],but ...
- PB中用回车键实现tab键的功能
先编辑控件的TabOrder顺序,然后在 global external functions 中定义一个API:Subroutine keybd_event(int bVk,int bScan,ulo ...
- 将回车键转换为Tab键
实现效果: 知识运用: KeyEventArgs类的KeyValue属性 public int KeyValue {get;} //获取KeyDown或KeyUp事件的键盘值 SendKeys类的Se ...
- 回车键转tab键
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> <head ...
- C语言 统计一串字符中空格键、Tab键、回车键、字母、数字及其他字符的个数(Ctrl+Z终止输入)
//凯鲁嘎吉 - 博客园 http://www.cnblogs.com/kailugaji/ #include<stdio.h> void main(){ , num=, blank=, ...
- CentOS 8 按tab键不能自动补全问题解决方案
CentOS中按tab键不能自动补全问题解决办法 检查一下系统有没有安装bash-completion包 [root@Sonarqube ~]# rpm -lq bash-completion yum ...
- JQuery实现回车代替Tab键(按回车跳到下一栏)
一个提交按钮以后,用户如果按了键盘的回车键,默认情况下,就会提交这个表单了.这样对于用户输入各个表单项目,用户体验很不好,输入完一个项目,或者用鼠标选择下一个项目,或者用键盘的Tab键选中下一个项目. ...
随机推荐
- opencv实现图像邻域均值滤波、中值滤波、高斯滤波
void CCVMFCView::OnBlurSmooth()//邻域均值滤波 { IplImage* in; in = workImg; IplImage* out = cvCreateImage( ...
- svg学习(七)polygon
<polygon> 标签用来创建含有不少于三个边的图形. <?xml version="1.0" standalone="no"?> & ...
- 关于Web项目里的给表单验证控件添加结束时间不得小于开始时间的验证方法,日期转换和前台显示格式之间,还有JSON取日期数据格式转换成标准日期格式的问题
项目里有些不同页面间的日期显示格式是不同的, 第一个问题: 比如我用日期控件WdatePicker.js导包后只需在input标签里加上onClick="WdatePicker()" ...
- 解决MyEclipse报错问题
转载文章. 做NC的时候从别人那拷了个NC_DEMO结果我这报错他那没报错 import nc.bs.wfengine.engine.ext.TaskTopicResolver; 报错信息:A ...
- JSP-14- 常用集合类和接口
List接口 List接口与实现类是容量可变的列表,可按索引访问集合中的元素,是有序的集合. Arraylist是以 array方式实现的List,允许快速随机存取,相当于LinkedList 不适合 ...
- C#的path.GetFullPath 获取上级目录实现方法
这篇文章主要介绍了C#的path.GetFullPath 获取上级目录实现方法,包含了具体的C#实现方法以及ASP.net与ASP等的方法对比,非常具有实用价值,需要的朋友可以参考下 本文实例讲述 ...
- [转] ubuntu开启SSH服务
点击阅读原文 SSH分客户端openssh-client和openssh-server如果你只是想登陆别的机器的SSH只需要安装openssh-client(ubuntu有默认安装,如果没有则sudo ...
- Python—I/O多路复用
一.I/O多路复用概念: 监听多个描述符的状态,如果描述符状态改变,则会被内核修改标志位,从而被进程获取进而进行读写操作 二.select,poll,epoll select模块,提供了:select ...
- 关于bootstrap
http://www.runoob.com/bootstrap/bootstrap-buttons.html file:///C:/LiuHuan/bc-bootstrap/bc-bootstrap/ ...
- 不同系统下的回车\r和换行\n,及其历史
我们平时按下键盘上的‘回车键’,就能实现回车换行[我们在屏幕上所看到的就是光标移到了下一行的开头位置!!ps:不讨论软件实现的特殊功能,如word里的回车智能缩进].因此对这个按键更准确说应该叫做‘回 ...