layui table中回车跳转到下一行的同一个单元格

直接上代码

        /*
        *tab 右边一个单元格
        *shift + tab 左边一个单元格
        *enter 下一行的单元格
        *shift + enter 上一行的单元格
        * ↑箭头 上一行的单元格
        * ↓箭头 下一行的单元格
        */
        $(document).on('keydown keyup', '.layui-input',
            function(event) {
                var td = $(this).parent('td'),
                    index = td.index(),
                    tr = td.parent('tr'),
                    isShift = $(document).data('shift'),
                    isKeydown = (event.type == "keydown");
                switch (event.key) {
                    case "Shift":
                        $(document).data('shift', isKeydown);
                        break;
                    case "Tab":
                        event.preventDefault();
                        isKeydown && td[isShift ? 'prev': 'next']().click();
                        break;
                    case "Enter":
                        isKeydown && tr[isShift ? 'prev': 'next']().children('td').eq(index).click();
                        break;
                    case "ArrowDown":
                        isKeydown && tr.next().children('td').eq(index).click();
                        break;
                    case "ArrowUp":
                        isKeydown && tr.prev().children('td').eq(index).click();
                        break;
                }
            })

说明:

1、等我有空再写上代码说明

你可能感兴趣的:(layui table中回车跳转到下一行的同一个单元格)