javascript - 使用向上/向下键在表格中的文本字段之间移动

Question

我有一个大致像这样设置的

Name            Description     Notes
===========================================
[___________]   [_________]     [_________]

有很多行，而不是用户在行中切换，我想实现按向上/向下键在所选列中上下移动。

行的 ID 为“row_{ID}”，其中 ID 是数据库 ID。这些字段具有 ID 'name_{ID}'、'description_{ID}'、'notes_{ID}' 等。

我正在用 jQuery 诱捕媒体，例如:

$('input[id^="name_"]').bind('keyup', function(e) {

    if(e.keyCode == 38)
        ...
    else if(e.keyCode == 40)
        ...
});

基本上我想要的是，如果用户在描述的第 2 行并向上按，他们将移动到第 1 行的描述字段，如果他们按下，他们将移动到第 3 行的描述字段。

我想不出选择下一行或上一行的方法。谁能提供帮助？

最佳答案

往下走:

$(this).closest('tr').next().find('input[name=' + $(this).attr('name') + ']').focus();

往上走:

$(this).closest('tr').prev().find('input[name=' + $(this).attr('name') + ']').focus();

也就是说，假设您的输入都被命名为相同的。

否则，您必须稍微更改该选择器，或者在 td 上使用 jQuery 的 .index()，然后使用 .eq( )。

关于javascript - 使用向上/向下键在表格中的文本字段之间移动，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/7257739/

上一篇：jquery - 无法弄清楚为什么该页面在 Firefox 中看起来很糟糕？在 Chrome/IE 中看起来不错

下一篇：jquery - 我怎样才能同时制作2个div的滚动条

相关文章：

jquery - 具有自定义外观的跨浏览器内容滚动

javascript - JQuery 追加 AJAX

javascript - 使用jquery表单时无法提交表单

html - 添加填充到 fa-fw Font Awesome 图标

JavaScript 在页面重新加载时保持选项卡

javascript - 使用 JQuery 将 JSON 项添加到 HTML 列表

javascript - 如何使用 jQuery 单击 div 中的文本

javascript - JavaScript 提交期间未传递 URL 参数

javascript - 克隆 div 后更改按钮的位置

javascript - 从 Internet Explorer 读取 Cookie

©2023 IT工具网  联系我们

Answer 1

往下走:

$(this).closest('tr').next().find('input[name=' + $(this).attr('name') + ']').focus();

往上走:

$(this).closest('tr').prev().find('input[name=' + $(this).attr('name') + ']').focus();

也就是说，假设您的输入都被命名为相同的。

否则，您必须稍微更改该选择器，或者在 td 上使用 jQuery 的 .index()，然后使用 .eq( )。