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

时间:2022-11-20 11:19:20

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

解释:

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;  
				}