easyui datagrid 键盘上下控制选中行示例

266 阅读 0 评论 176 点赞

我是靠谱客的博主超级彩虹，这篇文章主要介绍easyui datagrid 键盘上下控制选中行示例，现在分享给大家，希望可以做个参考。

扩展datagrid的一个方法keyCtr

复制代码代码如下:

 
$.extend($.fn.datagrid.methods, { 
keyCtr : function (jq) { 
return jq.each(function () { 
var grid = $(this); 
grid.datagrid('getPanel').panel('panel').attr('tabindex', 1).bind('keydown', function (e) { 
switch (e.keyCode) { 
case 38: // up 
var selected = grid.datagrid('getSelected'); 
if (selected) { 
var index = grid.datagrid('getRowIndex', selected); 
grid.datagrid('selectRow', index - 1); 
} else { 
var rows = grid.datagrid('getRows'); 
grid.datagrid('selectRow', rows.length - 1); 
} 
break; 
case 40: // down 
var selected = grid.datagrid('getSelected'); 
if (selected) { 
var index = grid.datagrid('getRowIndex', selected); 
grid.datagrid('selectRow', index + 1); 
} else { 
grid.datagrid('selectRow', 0); 
} 
break; 
} 
}); 
}); 
} 
}); 