91网首页-91网页版-91网在线观看-91网站免费观看-91网站永久视频-91网站在线播放

LOGO OA教程 ERP教程 模切知識交流 PMS教程 CRM教程 開發文檔 其他文檔  
 
網站管理員

如何給table添加方向鍵上下左右移動聚焦的功能

liguoquan
2023年6月12日 10:7 本文熱度 1227
:如何給table添加方向鍵上下左右移動聚焦的功能

  1. 文件最后面添加以下代碼

<script>

//全局變量

                var rows_count;

var cols_count;

               //向左移動函數

function moveLeft(r,c,tableId){

var obj = document.getElementById(tableId);

if (c>0) {

for(i=c-1;i>=0;i--){

try{

obj.rows[r].cells[i].childNodes[0].focus();

break;

}catch(e){

}

}

//obj.rows[r].cells[c].childNodes[0].focus();

}

                 //向右移動函數

function moveright(r,c,tableId){

var obj = document.getElementById(tableId);

if(c<obj.rows[r].cells.length ){

for(i=c+1;i<obj.rows[r].cells.length;i++){

try{

obj.rows[r].cells[i].childNodes[0].focus();

break;

}catch(e){

}

}

}

}

                 //向上移動函數

function moveup(r,c,tableId){

var obj = document.getElementById(tableId);

if(r>0){

for(i=r-1;i>=0;i--){

try{

    if((c+1)>obj.rows[i].cells.length){

     c=obj.rows[i].cells.length-1;

        }

obj.rows[i].cells[c].childNodes[0].focus();

break;

}catch(e){

}

}

}

 

}

                 //向下移動函數

function movedown(r,c,tableId){

var obj = document.getElementById(tableId);

if(r<(obj.rows.length-1)){

for(i=r+1;i<obj.rows.length;i++){

try{

if((c+1)>obj.rows[i].cells.length){

c=obj.rows[i].cells.length-1;

    }

obj.rows[i].cells[c].childNodes[0].focus();

break;

}catch(e){

}

}

}

}

/**

* @function 獲取Table單元格Input

* @param {string} 參數 tableId keycode

* @desription 說明:參數為Table的id值和對應方向鍵的數碼

*/

                 //獲取對應的行列數,并調方向鍵事件

function getTableValue(tableId,keycode) {

    var obj = document.getElementById(tableId);

    //循環Table行數  

    for (var i = 0; i < obj.rows.length; i++) {

            for (var j = 0; j < obj.rows[i].cells.length; j++) {

if (obj.rows[i].cells[j].childNodes[0] == document.activeElement) {    

rows_count=i;

cols_count=j;

       }

    }

if(keycode==37){

   moveLeft(rows_count,cols_count,tableId);

  }

  if(keycode==38){

   moveup(rows_count,cols_count,tableId);

  }

  if(keycode==39){

   moveright(rows_count,cols_count,tableId);

  }

  if(keycode==40){

   movedown(rows_count,cols_count,tableId);

  }

}

document.onkeydown=function(e){    //對整個頁面監聽  

var keyNum=window.event ? e.keyCode :e.which; 

//按下左鍵  

if(keyNum==37){  

getTableValue("indexTable","37");

}  

 

//向上鍵

if(keyNum==38){  

  getTableValue("indexTable","38");

  

}  

//右鍵

if(keyNum==39){

   getTableValue("indexTable","39");

   

}  

//向下鍵

if(keyNum==40){

  getTableValue("indexTable","40");

}  


}

</script>

2.如何調用,例如: getTableValue("indexTable","40");,該函數的第一參數對應的是table的id,只須改成對應table的id即可。也對多個table的id進行監聽。

多調用一次該函數即可,例如:

if(keyNum==40){

  getTableValue("indexTable","40");

                  getTableValue("headTable","40");

}  



該文章在 2023/6/12 10:07:07 編輯過
關鍵字查詢
相關文章
正在查詢...
點晴ERP是一款針對中小制造業的專業生產管理軟件系統,系統成熟度和易用性得到了國內大量中小企業的青睞。
點晴PMS碼頭管理系統主要針對港口碼頭集裝箱與散貨日常運作、調度、堆場、車隊、財務費用、相關報表等業務管理,結合碼頭的業務特點,圍繞調度、堆場作業而開發的。集技術的先進性、管理的有效性于一體,是物流碼頭及其他港口類企業的高效ERP管理信息系統。
點晴WMS倉儲管理系統提供了貨物產品管理,銷售管理,采購管理,倉儲管理,倉庫管理,保質期管理,貨位管理,庫位管理,生產管理,WMS管理系統,標簽打印,條形碼,二維碼管理,批號管理軟件。
點晴免費OA是一款軟件和通用服務都免費,不限功能、不限時間、不限用戶的免費OA協同辦公管理系統。
Copyright 2010-2025 ClickSun All Rights Reserved

主站蜘蛛池模板: 欧美日韩人兽 | 国产在线观看一区 | 国产精品十七区 | 国产欧美精品区 | 97午夜福利理论片 | 门国产乱 | 日本成a人片在线 | 国内精品免费视频 | 国产精品 | 国产自产在 | 91精品1区 | 中文字字幕乱码 | 日韩在线午夜 | 午夜国产一区 | 欧美日韩一区观看 | 国产亚洲精在线看 | 日韩一级在线观看 | 欧美一级在线做性 | 91播放| 成人午夜影院网站 | www.亚洲| 国产福利导 | 成人一区视频 | 国产精品免费网站 | 精品久爱| 日本阿v片在线 | 日韩在线欧美国产 | 理论精品电影 | 精品福利片在线观看 | 国产欧美精品一 | 国产日产久 | 日本遊學| 中文字幕va一区二 | 区二区播放视频 | 国产精品极品美 | 91视频播放| 国产大片亚州一 | 成人色91 | 日韩国产欧美制服 | 国产片v | 人人添逼人人摸人人 |