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