键盘上下键移动选择table表格行的js代码
作者:bea
//这是要操作的表格: <table id="tb"> <tr><td>这是第一行</td> </tr> <tr><td>这是第二行</td> </tr> <tr><td>这是第三行</td></tr> <tr><td>这是第四行</td></tr> </table&
//这是要操作的表格:
<table id="tb">
<tr><td>这是第一行</td> </tr>
<tr><td>这是第二行</td> </tr>
<tr><td>这是第三行</td></tr>
<tr><td>这是第四行</td></tr>
</table>
//这是操作表格的代码
<script>
var rowNo= -1;
var tableId = 'tb';
var inputId = 'show';
var selectedColor = "#FF0000"
function document.onkeydown()
{
//事件的标识代码
if (event.keyCode == 38)
{
for(var k=0;k<document.getElementById(tableId).rows.length;k++)
{
document.getElementById(tableId).rows(k).bgColor="#FFFFFF";
}
if(rowNo == 0)
{
rowNo++;
}
document.getElementById(tableId).rows(--rowNo%document.getElementById(tableId).rows.length).bgColor=selectedColor;
document.getElementById(inputId).value=document.getElementById(tableId).rows(rowNo%document.getElementById(tableId).rows.length).innerText;
}
//事件的标识代码
if (event.keyCode== 40)
{
for(var k=0;k<document.getElementById(tableId).rows.length;k++)
{
document.getElementById(tableId).rows(k).bgColor="#FFFFFF";
}
document.getElementById(tableId).rows(++rowNo%document.getElementById(tableId).rows.length).bgColor=selectedColor;
document.getElementById(inputId).value=document.getElementById(tableId).rows(rowNo%document.getElementById(tableId).rows.length).innerText;
}
}
</script>
<input type="text" id="show" value="do">
[Ctrl+A 全选 注:
如需引入外部Js需刷新才能执行]
有用 | 无用
猜你喜欢
您可能感兴趣的文章:
- JavaScript 拾漏补遗
- js 实现无干扰阴影效果 简单好用(附文件下载)
- 向大师们学习Javascript(视频与PPT)
- javascript+css 网页每次加载不同样式的实现方法
- 用Jquery实现可编辑表格并用AJAX提交到服务器修改数据
- jQuery中的常用事件总结
- jQuery 动态酷效果实现总结
- javascript dom操作之cloneNode文本节点克隆使用技巧
- javascript 格式化时间日期函数代码
- javascript 清空form表单中某种元素的值
- JavaScript 入门基础知识 想学习js的朋友可以参考下
- 十分钟打造AutoComplete自动完成效果代码
- jQuery 常见开发使用技巧总结
- javascript 最常用的10个自定义函数[推荐]
- javascript下利用数组缓存正则表达式的实现方法
- js 创建一个浮动div的代码
- 默认让页面的第一个控件选中的javascript代码
- js tab效果的实现代码
- javascript 计算两个整数的百分比值