<html>
<head>
<script type="text/javascript">
//索引，全局变量
var text_ind;
function of(text_index){
text_ind = text_index;
}
function okd(text_value){
var code_value = event.keyCode;
var next_name;
var flag = false;
var rng = document.selection.createRange();
rng.moveStart("character",-document.getElementById("t"+text_ind).value.length);
var gb_index = rng.text.length;
//判断按键是否为 -->
if(code_value==39){
//如果光标所在位置不是最后一个文本框,
//当光标不是最后一个且光标是在文本值最后时发生
if(text_ind!=8 && gb_index==3){
flag = true;
next_name = "t"+(text_ind+1);
}
}
//判断按键是否为 <--、
//当光标不是最后一个且光标是在文本值最前时发生
if(code_value==37){
if(text_ind !=0 && gb_index==0){
flag = true;
next_name = "t"+(text_ind-1);
}
}
//判断按键是否为 向上键
if(code_value==38){
//如果光标所在位置不是在第一行!
if(text_ind!=0 && text_ind!=1 && text_ind!=2){
flag = true;
next_name = "t"+(text_ind-3);
}
}
//判断按键是否为 向下键
if(code_value==40){
if(text_ind!=6 && text_ind!=7 && text_ind!=8){
flag = true;
next_name = "t"+(text_ind+3);
}
}
if(flag){
document.getElementById(next_name).focus();
}
}
</script> </head>
<body>
<table align="center" width="100" height="50">
<!-- 下面的函数of()中传递的是索引(第几个文本框)；函数okd()中传递的是text的值 -->
<tr>
<td> <input type="text" value="111" id="t0" onfocus="of(0)" onkeyup="okd('111')"/> </td>
<td> <input type="text" value="222" id="t1" onfocus="of(1)" onkeyup="okd('222')"/> </td>
<td> <input type="text" value="333" id="t2" onfocus="of(2)" onkeyup="okd('333')"/> </td>
</tr>
<tr>
<td> <input type="text" value="444" id="t3" onfocus="of(3)" onkeyup="okd('444')"/> </td>
<td> <input type="text" value="555" id="t4" onfocus="of(4)" onkeyup="okd('555')"/> </td>
<td> <input type="text" value="666" id="t5" onfocus="of(5)" onkeyup="okd('666')"/> </td>
</tr>
<tr>
<td> <input type="text" value="777" id="t6" onfocus="of(6)" onkeyup="okd('777')"/> </td>
<td> <input type="text" value="888" id="t7" onfocus="of(7)" onkeyup="okd('888')"/> </td>
<td> <input type="text" value="999" id="t8" onfocus="of(8)" onkeyup="okd('999')"/> </td>
</tr>
</table>
</body>
</html>
分享到：
相关推荐
最近公司开发ERP项目，要求商品入库选择货架号时支持使用方向键快速选择，以提高入库效率。
"方向键盘控制table内的input标签焦点"这一主题关注的是如何通过键盘导航提高用户在表格内输入数据的效率。在传统的网页交互中，用户通常通过鼠标点击来切换输入框的焦点，但通过键盘的上下左右箭头键进行导航能提供...
本篇将详细探讨如何解决layui-table单元格编辑仅支持text问题，以便在实际项目中实现更多元化的表单控件，如自定义表单类型、时间控件、数字框、下拉选择和单选等。 layui-table是layui框架中的表格组件，它提供了...
本篇文章将详细探讨如何在 JSP（JavaServer Pages）环境中利用 JavaScript 来实现表格单元格的合并功能。 #### 一、背景介绍 在给定的示例代码中，我们看到了一个通过 JSP 和 Struts2（`<s:iterator>` 标签）生成...
例如，在报表展示或者数据汇总场景中，通过合并单元格可以使得表格更加简洁明了，而隐藏不必要的列则可以让用户更专注于重要的数据。 #### 二、代码解析 本文将详细介绍如何使用 JavaScript 实现上述功能，并结合...
在网页设计中，用户与页面交互的一个常见行为是使用键盘进行导航，特别是使用"Enter"键来提交表单或在多个输入框之间切换。本文将深入探讨如何利用HTML和jQuery实现"Enter"键控制input光标移动的功能，使得用户在按...
在layui中，我们可以利用表格的`render`方法渲染数据，并通过JavaScript逻辑判断哪些单元格需要合并。通常，这涉及到对数据源的分析，找出需要合并的行或列。例如，如果连续几行有相同的数据，那么它们对应的单元格...
在Web开发中，焦点管理是一项重要的...通过理解并应用上述知识点，开发者可以利用JQuery轻松地实现在Web应用中使用方向键控制焦点的功能，提升用户的交互体验。在实际项目中，还需要根据具体需求进行适当的调整和优化。
在表格（Table）设计中，有时我们需要合并单元格来达到特定的展示效果，例如创建标题行或列，或者为了美观和布局对齐。在HTML、CSS以及JavaScript中，都有多种方式可以实现单元格的合并。这里我们将详细探讨六种合并...
【标题】"javascript经典特效---光标选择输入框.rar"主要关注的是JavaScript在网页交互中的一个常见应用，即光标选择输入框的实现。在网页设计中，输入框是用户与页面进行数据交互的重要元素，而光标选择则是用户...
只要输入table的id，就可以自动合并单元格，只要上下相邻的单元格相同的，都会合并 html版比较好，点下面的 http://download.csdn.net/source/1276574
还有我后面会介绍的"使用方向键在输入框矩阵中自然的导航"，核心技术点也是获取输入框中的光标位置。 获取输入框中的光标位置的整个代码其实很短，只是这些对象和方法不太常用而已。下面是一个使用JavaScript获取...
在JavaScript中，虽然有一些基本的方法可以操作光标，但它们通常比较复杂，不便于直接使用。这就是插件的价值所在，它封装了这些复杂操作，提供简洁易用的API供开发者调用。 该插件可能包含以下核心功能： 1. **...
在JavaScript中，动态修改表格（Table）以及合并单元格是常见的需求，特别是在处理数据展示或者报表生成时。以下将详细介绍如何使用JS实现这些功能。 首先，要动态修改表格，我们需要获取表格元素。在HTML中，表格...
在上面的代码中，我们使用了 Bootstrap Table 的 CSS 文件来美化表格的样式，使用 jQuery 库来动态添加新的表格行，并使用 input 元素来编辑单元格的内容。同时，我们还使用 JavaScript 代码来保存修改后的内容，并...
根据提供的文件信息，本文将详细解释如何在EasyUI DataGrid中实现上下左右及回车键切换单元格的功能。EasyUI 是一个基于 jQuery 的用户界面插件集合，它提供了丰富的 UI 组件来帮助开发者快速构建现代化的 Web 应用...
通过以上步骤，我们可以有效地在LayUI Table中实现相同参数的单元格合并，提升数据展示的效率和美观性。在实际项目中，根据具体需求调整和优化这些方法，以达到最佳效果。对于压缩包文件"tableMerge"，它可能包含了...
这通常发生在用户不直接通过鼠标点击输入框，而是由程序逻辑控制光标位置的情况，比如编辑图片描述或使用某些富文本编辑器。在本篇讨论中，我们将探讨如何用JavaScript来实现这个功能，主要涉及`HTMLElement`对象的`...
3. **单元格合并**：在网页开发中，如果需要将多个相邻的单元格合并成一个大单元格，可以使用`rowspan`和`colspan`属性。`colspan`与`rowspan`类似，但作用于列的跨度。合并单元格可以提高表格布局的复杂性和美感。 ...