支持键盘上下键的隔行变色代码

支持键盘上下键的隔行变色代码:
隔行变色代码非常的常用,尤其是在新闻列表形式的场景,不过大多数都只是支持鼠标效果,而对键盘的上下键并不支持。
下面就提供一段支持上下键的隔行变色效果代码。
代码如下:

  );  
})  
</script> 
</head> 
<body> 
<form id="form1" name="form1" method="post" action=""> 
  <label> 
    <input type="text" name="txt_no" id="txt_no" /> 
  </label> 
  <table width="600" border="0" cellpadding="3" cellspacing="1" class="datagrid"> 
    <tr> 
      <td>1</td> 
      <td> 张三</td> 
      <td></td> 
    </tr> 
    <tr> 
      <td>2</td> 
      <td>李四</td> 
      <td></td> 
    </tr> 
    <tr> 
      <td>3</td> 
      <td>王五</td> 
      <td></td> 
    </tr> 
    <tr> 
      <td>4</td> 
      <td>马六</td> 
      <td></td> 
    </tr> 
    <tr> 
      <td>5</td> 
      <td></td> 
      <td></td> 
    </tr> 
    <tr> 
      <td>6</td> 
      <td></td> 
      <td></td> 
    </tr> 
    <tr> 
      <td>7</td> 
      <td></td> 
      <td></td> 
    </tr> 
    <tr> 
      <td>8</td> 
      <td></td> 
      <td></td> 
    </tr> 
    <tr> 
      <td>9</td> 
      <td></td> 
      <td></td> 
    </tr> 
    <tr> 
      <td>10</td> 
      <td></td> 
      <td></td> 
    </tr> 
  </table> 
  <input type="hidden" name="prevTrIndex" id="prevTrIndex" value="-1" /> 
</form> 
</body> 
</html>

上面代码实现了我们的需求,当点击上下键盘按钮的时候,可以实现隔行变色效果,并且当鼠标放在某一行上,点回车键,能够将行数填写在顶部文本框中。

原文地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=7885

更多内容可以参阅:http://www.softwhy.com/jquery/

更多相关文章
  • jquery实现的隔行变色代码实例: 隔行变色效果在大量的网站应用,尤其是表格或者新闻列表之类的结构,可以有效增强网站的辨识度,更为人性化,下面通过一个简单的实例介绍一下它的实现原理,至于它的美观度这里就不讲究了,代码实例如下: ){ $(this).css(odd); } else{ $(this ...
  • 以前以为Table隔行变色只能通过js和后台逻辑代码实现,但是今天帮同事处理Table隔行变色时发现css里面也能写逻辑代码:直接上代码(复制到本地运行查看效果):Table隔行变色
  • 隔行变色表格隔行变色+LI浮动隔行变色
    第一篇文章哈 随便写写表格隔行变色,一个很普通的js效果... 但是我非常不喜欢用table,一是代码累赘,再是...我通常用li写信息列表.例如相册列表,通常是用浮动排版,或者block-inline...一行有好几个li元素这时要隔行变色的话...首先假如总共有7个li,一行有3个li,那最后一 ...
  • 今日对vc6.0下键盘组合键的监控做了一些工作.遇到的问题如下. 1.WH_KEYBOARD无法监控组合键的问题.网上查找资料时,有人说监控组合键需要使用WH_KEYBOARD_LL.但调用此方法时,编译时遇到一个问题."KBDLLHOOKSTRUCT"无法识别,这是由于vc6. ...
  • jquery实现输入框聚焦,键盘上下键选择城市
    在最近有个项目中 需要实现当文本框聚焦的时候,可以键盘上下键选择内容,按enter键的时候,把内容传到输入框中,: 实现代码如下: /** *输入框聚焦,键盘上下键选择城市 */ ;(function($){ $.fn.inputKey=function(options){ var settings ...
  • 实现table表格各行变色代码实例:本章节介绍一下如何实现表格内容的隔行变色效果,这一效果的应用非常广泛,因为它有着较高的实用性,并且实现代码也比较简单,下面就通过代码实例介绍一下如何实现此效果.代码如下: <!DOCTYPE html> <html> <head> ...
  •     远程桌面键盘异常, 远程桌面不支持键盘,远程桌面不支持个别字母键解决方法:    维护2003系统服务器3年多 但最近一年有时会遇到:远程桌面键盘异常, 远程桌面不支持键盘,远程桌面不支持个别字母键 很长时间没有解决:今天终于解决啦!方法很简单    #. 现象        输入文字的时候 ...
  • C#WPFDataGrid隔行变色及内容居中对齐
    C# WPF DataGrid 隔行变色及内容居中对齐. dqzww NET学习0 先看效果: 前台XAML代码: <!--引入样式文件-->    <Window.Resources>        <ResourceDictionary>            ...
一周排行