利用jquery实现在html的表格中使用上下左右键切换单元格,同时只限制单元格输入数字

来源：互联网发布：知乎赛博朋克编辑：程序博客网时间：2024/05/18 02:54

因其他无关代码比较多，只贴关键代码，请谅解。

解释：

tblGrid是表格的id ，<pre name="code" class="html">onchange是每个单元格都拥有的方法，当然可以根据实际情况更改

flag是标志位，保证按照我想要的顺序新增tabindex

<script type="text/javascript">    $(function() {        var baseIndex = 100;var flag=1;$("#tblGrid").find("tr").each(function(r) {if($(this).find("[onchange]").length >0){  $(this).find("[onchange]").each(function(c) {$(this).attr("tabindex", flag * 100 + c + baseIndex);});flag++;}            });      });</script>

<pre name="code" class="html">/**控制input框 限制只能输入数字*/function check(event) {    var e = window.event || event;    var target = e.srcElement || e.target;    var tabIndex=target.tabIndex;  var className=target.className;  var k = e.keyCode;    if(isFunKey(k,tabIndex)) {  return true;    }    var c = getChar(k);    if(target.value.length == '' && (c == '-' || c == '+')) {  return true;    }    if(isNaN(target.value + getChar(k))) {  return false;    }    return true;  }    function isFunKey(code,tabIndex) {    //  8 --> Backspace    //  9 --> tab    // 35 --> End    // 36 --> Home    // 37 --> ←  // 38 --> ↑  // 39 --> →  // 40 --> ↓   // 46 --> Delete    // 112~123 --> F1~F12    var funKeys = [8,9, 35, 36, 37,38, 39,40, 46];    for(var i = 112; i <= 123; i++) {  funKeys.push(i);    }     for(var i = 0; i < funKeys.length; i++) {  if(funKeys[i] == code) {if(funKeys[i]==38){tabIndex -= 100;  $("input[tabindex=" + tabIndex + "]").focus();  return false;}else if(funKeys[i]==40){tabIndex += 100; $("input[tabindex=" + tabIndex + "]").focus();  return false;}else if(funKeys[i]==37){  tabIndex--; $("input[tabindex=" + tabIndex + "]").focus();  return false;}else if(funKeys[i]==39){tabIndex++; $("input[tabindex=" + tabIndex + "]").focus();  return false;}    return true;  }    }    return false;  }

0 0