jQuery实现table隔行换色和鼠标经过变色的两种方法
$("tr:odd").css("background-color","#eeeeee");
$("tr:even").css("background-color","#ffffff");
$("table tr:nth-child(odd)").css("background-color","#eeeeee");
:nth-child 匹配其父元素下的第N个子或奇偶元素
$("tr").live({
mouseover:function(){
$(this).css("background-color","#eeeeee");
},
mouseout:function(){
$(this).css("background-color","#ffffff");
}
})
$("tr").bind("mouseover",function(){
$(this).css("background-color","#eeeeee");
})
$("tr").bind("mouseout",function(){
$(this).css("background-color","#ffffff");
})
当然live()和bind()都可以同时绑定多个事件或分开。
相关推荐
-
jquery实现table鼠标经过变色代码
复制代码 代码如下: $('#<%=AllEvent.ClientID%> tr:not(:has("th"))').hover(function () { $bg = $(this).css('background-color'); $(this).css('background-color', '#ffc4c6'); }, function () { $(this).css('background-color', $bg); });
-
jQuery实现获取table中鼠标click点击位置行号与列号的方法
本文实例讲述了jQuery实现获取table中鼠标click点击位置行号与列号的方法.分享给大家供大家参考,具体如下: 先来看看运行效果: 具体代码如下: <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>www.jb51.net 鼠标点击位置行列号</title> </head> <bo
-
jQuery实现鼠标双击Table单元格变成文本框及输入内容后更新到数据库的方法
本文实例讲述了jQuery实现鼠标双击Table单元格变成文本框及输入内容后更新到数据库的方法.分享给大家供大家参考,具体如下: JS鼠标双击事件 onDblClick <td width="10%" title="双击修改" ondblclick="ShowElement(this,<%#Eval("id") %> </td> 这里的本人用绑定的值是传的当前行对应的ID号 function ShowEle
-
jquery获取table中的某行全部td的内容方法
复制代码 代码如下: <table><tr class="PurViewData" id="trid95"> <td>14</td> <td id="95"><a style="color:#0000CC" href="/PurviewManage/AddPurview?id=95">TopParty优惠</a>
-
jquery遍历table的tr获取td的值实现方法
html代码: <tbody id="history_income_list"> <tr> <td align="center"><input type="text" class="input-s input-w input-hs"></td> <td align="center"><input type="text&q
-
jQuery操作表格(table)的常用方法、技巧汇总
以下列出13个jQuery操作table常用到的功能: 1.鼠标移动行变色 复制代码 代码如下: $('#table1 tr').hover(function(){ $(this).children('td').addClass('hover')}, function(){ $(this).children('td').removeClass('hover')}); 方法二: 复制代码 代码如下: $("#table1 tr:gt(0)").hover(function()
-
jQuery插件dataTables添加序号列的方法
官网方法实例: $(document).ready(function() { var t = $('#example').DataTable({ "columnDefs": [{ "searchable": false, "orderable": false, "targets": 0 }], "order": [[1, 'asc']] }); t.on('order.dt search.dt', func
-
JQuery动态给table添加、删除行 改进版
复制代码 代码如下: <html> <head> <title> </title> <script src="js/jquery-1.4.2_min.js" type="text/javascript"></script> <script type="text/javascript" language="javascript"> var row
-
jQuery实现鼠标跟随提示层效果代码(可显示文本,Div,Table,Html等)
本文实例讲述了jQuery实现鼠标跟随提示层效果代码.分享给大家供大家参考,具体如下: 运行效果截图如下: Web网站有不少需要用到tip提示层的地方,结合jquery的jquery.cluetip.js ,可以实现本地字符或ajax异步调用显示提示层.如以上购评分明细提示.(优势:宽度需要调用页加载时定义,高度auto , 且三角指定图标能根据显示层的大小位置来调用它的位置,达到醒目直观的效果) jquery.cluetip.css /* global */ #cluetip-close im
-
jQuery实现table中的tr上下移动并保持序号不变的实例代码
jQueryMoveTr.html 代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE>jQuery-bhang</TITLE> <script type="text/javascript" src="jquery-1.6.2.js"></sc
-
jquery实现的鼠标拖动排序Li或Table
1.前端页面 复制代码 代码如下: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="拖动排序Li或Table.aspx.cs" Inherits="拖动排序Li或Table" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http
随机推荐
- iOS常用的公共方法详解
- iOS中searchBar(搜索框)光标初始位置后移
- Swift让输入框跟随键盘弹起避免输入输入法挡住输入框问题
- PHP与Java进行通信的实现方法
- php字符串函数学习之substr()
- Android编程之监听器用法实例分析
- 在Python中使用glob模块查找文件路径的方法
- Powershell实现导入安装证书功能脚本分享
- SQL2000安装后,SQL Server组无项目解决方法
- 分享apache http服务器设置虚拟主机的方法
- js客户端快捷键管理类的较完整实现和应用
- 使用单链表实现多项式计算示例
- 深入理解Java的接口与抽象类
- c# 深拷贝与浅拷贝的区别分析及实例
- 我的论坛源代码(十)
- MySQL慢查询之开启慢查询
- angular中ui calendar的一些使用心得(推荐)
- 浅析正则表达式 元字符和普通字符
- vue-router启用history模式下的开发及非根目录部署方法
- ES6小技巧之代替lodash