• 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实现控制表格行高亮实例

作者: 字体:[增加 减小] 来源:互联网

通过本文主要向大家介绍了表格,行,高亮等相关知识,希望对您有所帮助,也希望大家支持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动态生成不规则表格(前后端)

相关文章

  • jQuery遮罩层实例讲解
  • 推荐10 个很棒的 jQuery 特效代码
  • 使用隐藏的new来创建对象
  • jQuery阻止移动端遮罩层后页面滚动
  • jQuery实现单击弹出Div层窗口效果(可关闭可拖动)
  • jQuery Validation Engine验证控件调用外部函数验证的方法
  • jQuery检测某个元素是否存在代码分享
  • jQuery处理xml格式的返回数据(实例解析)
  • 10个基于jQuery或JavaScript的WYSIWYG 编辑器整理
  • jquery统计复选框选中示例

文章分类

  • 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 EasyUI 为Combo,Combobox添加清除值功能的实例
    • jquery中绑定事件的异同
    • JQuery中DOM事件冒泡实例分析
    • jquery实现可自动判断位置的弹出层效果代码
    • Jquery promise实现一张一张加载图片
    • JQuery中$.each 和$(selector).each()的区别详解
    • JQuery的ajax基础上的超强GridView展示
    • z-blog SyntaxHighlighter 长代码无法换行解决办法(jquery)

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

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