Question

我有一个跨多个div的HTML表单。当用户在每个div中的第一个或最后一个元素上时，我需要知道用户何时按Tab键（因此我可以应用一些自定义选项卡功能）。对于div中的第一个元素，我正在寻找Tab + Shift;对于最后一个元素，我正在寻找Tab。元素可以是文本框，文本区，单选按钮，选择列表或复选框。

检测第一个和最后一个元素的最有效方法是什么？很高兴使用jQuery解决方案。

感谢。

Answer 1

您可以使用:first-child和:last-child选择器查找表单元素。然后，您可以附加keydown事件处理程序并分别检查SHIFT + TAB和TAB。

$('div input:first-child').keydown(function(event) {
    if (event.which == 9 && event.shiftKey) { // Tab is keycode 9
        // Do custom tab handling
    }
});

$('div input:last-child').keydown(function(event) {
    if (event.which == 9) {
        // Do custom tab handling
    }
});

Answer 2

您可以使用第一个和最后一个子选择器：

var first = $("#form-name:first-child");
var last = $("#form-name:last-child");

Answer 3

只要输入确实是DIV的第一个和最后一个孩子，下面的内容就可以了。否则你将需要更加棘手的选择。

编辑：我关于子订单的断言似乎不正确。这适用于大多数情况。 结束修改

如果您希望它特定于某些类型的输入，或任何被视为输入但实际上不是input元素的内容，则选择器需要进行一些小调整。

<强>演示

http://jsfiddle.net/JAAulde/tHkdz/

<强>代码

$( '#myform' )
    .find( 'div input:first-child, div input:last-child' )
    .bind( 'keydown', function( e )
    {
        if( e.which === 9 )
        {
            //custom code here
            e.preventDefault();
        }
    } );

Answer 4

听起来你想要在第一个和最后一个元素上包含标签页。

获取第一个：$('#form').find('input, textarea, select').first();
获取最后一个：$('#form').find('input, textarea, select').first();
将keydown绑定到元素：.keydown()
- 使用它来确定按下了哪个键：jQuery Event Keypress: Which key was pressed?
- 然后专注于您想要的元素：.focus()

编辑：选择器逻辑错误

例如：http://jsfiddle.net/rkw79/fuXyf/

检测用户在第一个或最后一个表单元素上按Tab键（在div中）

4 个答案: