• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号
您的位置:首页 > 程序设计 >jquery > jquery实现控制表格行高亮实例

jquery实现控制表格行高亮实例

作者: 字体:[增加 减小] 来源:互联网 时间:2017-08-16

通过本文主要向大家介绍了表格,行,高亮等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com

[css]

<style>
.height{
  background:#666666;   /*背景颜色为灰色*/
}
tr{
 cursor: pointer;    /*手形*/
}
</style>

[html] 

<body>
<table border="1" width="40%">
   <tr><th></th><th align="left">姓名</th><th align="left">性别</th><th align="left">居住地</th></tr>
   <tr>
        <td><input type="radio" name="radio" /></td><td>张三</td><td>男</td><td>北京</td>
   </tr>
    <tr>
        <td><input type="radio" name="radio" /></td><td>李四</td><td>男</td><td>上海</td>
   </tr>
    <tr>
        <td><input type="radio" name="radio" /></td><td>王五</td><td>女</td><td>深圳</td>
   </tr>
    <tr>
        <td><input type="radio" name="radio" /></td><td>赵六</td><td>女</td><td>北京</td>
   </tr>
    <tr>
        <td><input type="radio" name="radio" /></td><td>孙七</td><td>男</td><td>上海</td>
   </tr>
</table>
</body>

jquery

[javascript]

$(document).ready(function(){
    //第一种写法: $("tr:gt(0)")   第一行标题不起作用
    $("tr:gt(0)").click(function(){
     $(this).addClass("height").siblings().removeClass("height").end().find(":radio").attr("checked",true);
    })

    //第二种写法:$("tr:not(:first)")
    /*$("tr:not(:first)").click(function(){
     $(this).addClass("height").siblings().removeClass("height").end().find(":radio").attr("checked",true);
    })*/
})

分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • jQuery实现可编辑表格并生成json结果(实例代码)
  • jQuery 实现双击编辑表格功能
  • jquery DataTable实现前后台动态分页
  • JQuery.dataTables表格插件添加跳转到指定页
  • layui表格实现代码
  • 使用jquery datatable和bootsrap创建表格实例代码
  • jQuery实现表格奇偶行显示不同背景色 就这么简单
  • jQuery表格(Table)基本操作实例分析
  • jQuery给表格添加分页效果
  • jQuery动态生成不规则表格(前后端)

相关文章

  • 2017-08-16JQuery 学习笔记 选择器之二
  • 2017-08-16分享10篇优秀的jQuery幻灯片制作教程及应用案例
  • 2017-08-16初识JQuery 实例一(first)
  • 2017-08-16jQuery复合事件用法示例
  • 2017-08-16jQuery基础学习技巧总结第1/4页
  • 2017-08-16jQuery客户端分页实例代码
  • 2017-08-16JQuery入门基础小实例(1)
  • 2017-08-16jquery实现的一个文章自定义分段显示功能
  • 2017-08-16jQuery插件EasyUI实现Layout框架页面中弹出窗体到最顶层效果(穿越iframe)
  • 2017-08-16jquery ajax 同步异步的执行示例代码

文章分类

  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号

最近更新的内容

    • 锋利的jQuery 要点归纳(三) jQuery中的事件和动画(上:事件篇)
    • 浅析jquery与checkbox的checked属性的问题
    • 最新的10款jQuery内容滑块插件分享
    • jQuery 下拉列表 二级联动插件分享
    • 基于jquery的一个拖拽到指定区域内的效果
    • jQuery调用WebService的实现代码
    • jQuery插件HighCharts实现的2D回归直线散点效果示例【附demo源码下载】
    • jQuery 操作下拉列表框实现代码
    • jQuery Easyui Treegrid实现显示checkbox功能
    • jquery中this的使用说明

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有