jquery - 带有 JEditable 字段的 Tab 键

Question

我有一个页面，使用 JQuery 和 Jeditable 在页面上创建可编辑的文本元素。

在编辑元素时，我希望能够从一个元素切换到下一个元素。

我不确定如何:

• 使用jeditable或jquery捕获tab键事件(keycode = 9)

• 检测到该事件后，将焦点移动到下一个元素并通过 jeditable 激活它

任何帮助表示赞赏。谢谢!

Answer 1

我设法找到了一种方法:

$('div.editbox').bind('keydown', function(evt) {
    if(evt.keyCode==9) {
        $(this).find("input").blur();
        var nextBox='';
         if ($("div.editbox").index(this) == ($("div.editbox").length-1)) {
                nextBox=$("div.editbox:first");         //last box, go to first
            } else {
                nextBox=$(this).next("div.editbox");    //Next box in line
            }
        $(nextBox).dblclick();  //Go to assigned next box
        return false;           //Suppress normal tab
    };
});

在选项卡上，双击(此处设置 jeditable 以使用 dblclick 事件)将发送到下一个框。如果它是最后一个编辑框(分配了一个唯一的类，我在选择器方面遇到了问题)，它将转到第一个编辑框。

我还使用了 find("input")，因为我无法找到另一个选择器来选择 jeditable 创建的输入进行模糊处理。

不是最佳的，但它有效。