easyui datagrid 鍵盤上下控制選中行示例
更新時(shí)間:2014年03月31日 16:41:13 作者:
這篇文章主要介紹了擴(kuò)展datagrid的一個(gè)方法keyCtr實(shí)現(xiàn)鍵盤上下控制選中行,需要的朋友可以參考下
擴(kuò)展datagrid的一個(gè)方法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;
}
});
});
}
});
復(fù)制代碼 代碼如下:
$.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;
}
});
});
}
});
您可能感興趣的文章:
- jQuery Easyui學(xué)習(xí)教程之實(shí)現(xiàn)datagrid在沒有數(shù)據(jù)時(shí)顯示相關(guān)提示內(nèi)容
- JQuery EasyUI學(xué)習(xí)教程之datagrid 添加、修改、刪除操作
- jQuery Easyui datagrid/treegrid 清空數(shù)據(jù)
- jQuery Easyui學(xué)習(xí)之datagrid 動(dòng)態(tài)添加、移除editor
- EasyUI中datagrid在ie下reload失敗解決方案
- EasyUi datagrid 實(shí)現(xiàn)表格分頁
- Jquery下EasyUI組件中的DataGrid結(jié)果集清空方法
- JQueryEasyUI datagrid框架的基本使用
- jQuery EasyUI學(xué)習(xí)教程之datagrid點(diǎn)擊列表頭排序
相關(guān)文章
用圖片替換checkbox原始樣式并實(shí)現(xiàn)同樣的功能
這篇文章主要介紹了用圖片替換checkbox原始樣式并實(shí)現(xiàn)同樣的功能 ,本文給大家介紹的非常詳細(xì),具有一定的參考借鑒價(jià)值,需要的朋友參考下吧2018-11-11jQuery源碼分析-03構(gòu)造jQuery對象-工具函數(shù)
jQuery源碼分析-03構(gòu)造jQuery對象-工具函數(shù),需要的朋友可以參考下。2011-11-11jquery實(shí)現(xiàn)兩邊飄浮可關(guān)閉的對聯(lián)廣告
可關(guān)閉的左右兩邊漂浮的對聯(lián)廣告代碼jquery特效,寬屏分辨率大于1024px才顯示,當(dāng)用戶點(diǎn)擊關(guān)閉按鈕可以單獨(dú)關(guān)閉自己一邊的漂浮的對聯(lián)廣告代碼,juqery對聯(lián)廣告效果感興趣的朋友一起學(xué)習(xí)吧2015-11-11jquery插件EasyUI中form表單提交實(shí)例分享
這篇文章主要介紹了jquery插件EasyUI中form表單提交實(shí)例,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-01-01jquery validate poshytip 自定義樣式
項(xiàng)目中做了一個(gè)jquery.validate氣泡提示在新版的jquery.validate中,有這個(gè)功能,但在我這里不怎么好用,所以自己加了一個(gè),找了一些插件qtip2的樣式不錯(cuò),需要的朋友可以參考下2012-11-11jQuery函數(shù)的第二個(gè)參數(shù)獲取指定上下文中的DOM元素
這篇文章主要介紹了jQuery函數(shù)的第二個(gè)參數(shù)獲取指定上下文中的DOM元素,需要的朋友可以參考下2014-05-05JQuery 引發(fā)兩次$(document.ready)事件
ASP.net MVC 做了個(gè)工程,不知道為什么Search按就總是執(zhí)行兩次。2010-01-01