html调整table方向,layUI关于table编辑列支持方向键功能

/**编辑数据表格，键盘快捷键方法。

*可跳过无编辑属性的列

*tab 右边一个单元格

*shift + tab 左边一个单元格

*enter 下一行的单元格

*shift + enter 上一行的单元格*/

//支持tab+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 ? 'prevAll' : 'nextAll']('[data-edit="text"]:first').click();

//break;

//case "Enter":

//isKeydown && tr[isShift ? 'prev' : 'next']().children('td').eq(index).click();

//break;

//}

//});

//方向键的切换

$(document).on('keydown', '.layui-table-edit', function(e) {var td = $(this).parent('td'),

tr= td.parent('tr'),

trs= tr.parent().parent().find("tr")

tr_index=tr.index(),

td_index=td.index(),

td_last_index= tr.find('[data-edid="text"]:last').index(),

td_first_index= tr.find('[data-edid="text"]:first').index();switch(e.keyCode) {case 13:case 39:

td.nextAll('[data-edit="text"]:first').click();if (td_index ==td_last_index) {

tr.next().find('td').eq(td_first_index).click();if (tr_index == trs.length - 1) {

trs.eq(0).find('td').eq(td_first_index).click()

}

}

setTimeout(function() {

$('.last-table-edit').select()

},0)break;case 37:

td.prevAll('[data-edit="text"]:first').click();

setTimeout(function() {

$('.last-table-edit').select()

},0)break;case 38:

tr.prev().find('td').eq(td_index).click();

setTimeout(function() {

$('.last-table-edit').select()

},0)break;case 40:

tr.next().find('td').eq(td_index).click();

setTimeout(function() {

$('.last-table-edit').select()

},0)break;

}

});