很多高手也位jquery写了专门的排序库,因为自己也想尝试一下, 当然运行速度实在不能接受,但是我会慢慢的把他改进的。 注:这里只是拿出了一部分代码来,查看演示demo 文档载入后给'th'添加click事件。 1. $('th').click(function(){ var date1=(new Date()).getTime() var dataType=$(this).attr('dataType'); 找到点击对象的自定义属性dataType,当然这个不符合W3C的标准是无法通过检验的,也可以用ID或者class来定义,但是我觉...
代码如下: html 代码如下:<div> <table> <tr><td>1111</td><td><input type="button" value="添加下一行" /><input type="button" value="删除下一行" /></td></tr> <tr><td>2222</td><td><input type="button" value="添加下一行" /><input type="button" value="删除下一行" /></td></tr> <tr><td>4444</td><td><input type="button" value="添加下一行" /><input type="button" value="删除下一行" /></td></tr> </table> </d...
效果图:代码: 代码如下:<%@ Page Language="C#" AutoEventWireup="true" CodeFile="JqueryTableFilter.aspx.cs" Inherits="JqueryTableFilter" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <script src="Script/jquery-1.3.2-vsdoc.js" type="text/jav...
固定表头 列宽可调整 单击列头可排序 双击单元格可编辑 可绑定数据源 看下效果吧:HTML - 模板代码: 代码如下:<table id="test"> <tr class="header"> <td style="width: 100px;" sort=true> 姓名 </td> <td style="width: 100px;" sort=true> 性别 </td> <td style="width: 100px;" sort=true> 年龄 </td> <td style="width:200px;" sort=true> 住址 </td> </tr> <tr class="itemtemplate"> <td editable=true> {姓名} </td> <td...
效果图: 代码如下:<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>jQuery EasyUI</title> <link rel="stylesheet" type="text/css" href="../themes/default/easyui.css"> <link rel="stylesheet" type="text/css" href="../themes/icon.css"> <script type="text/javascri...
段时间做项目时候由于需要显示一个列表,但是由于数据太多在滚动的时候表头必须冻结住,所以就写了下面这个脚本(曾经在网上也找过相应的脚本,但是不怎么理想所以就自己写了,但是目前由于项目仅仅用到了表头的冻结,而不需要指定列冻结所以目前只能算个不完整的脚本,不过一般的仅仅需要表头冻结就可以使用了),现在先看看截图: 这样实现了表头的冻结,下面表体内容可以自由滚动 看下代码: //为jquery扩展一个CloneTableHeade...
jQuery 表格插件 Flexigrid – Web 2.0 Javscript Grid for jQuery - 可变列宽,自动适应表头宽度,可通过 Ajax 连接 XML 数据源,类似 Ext Grid,但基于 jQuery 因此更轻量小巧。Chromatable JQuery Plugin - 固定表头,可滚动内容区,内容区滚动的时候表头位置保持不变。Ingrid, the jQuery Datagrid - 在 HTML 表格上加入列宽调整,分页,排序,行列式样等功能(演示)。JQTreeTable - 在表格中加入树形结构Scrollable HTML tab...
jQuery 表格插件 Flexigrid – Web 2.0 Javscript Grid for jQuery - 可变列宽,自动适应表头宽度,可通过 Ajax 连接 XML 数据源,类似 Ext Grid,但基于 jQuery 因此更轻量小巧。Chromatable JQuery Plugin - 固定表头,可滚动内容区,内容区滚动的时候表头位置保持不变。Ingrid, the jQuery Datagrid - 在 HTML 表格上加入列宽调整,分页,排序,行列式样等功能(演示 )。JQTreeTable - 在表格中加入树形结构Scrollable HTML ta...
大多数前端er都把网页中的table标签替换为div,主要就是因为div要比table更容易添加CSS样式。但是我们在日常应用中仍然要用到table表格,其中最好的例子就是对照表。今天彬Go将向大家推荐15个jQuery表格插件让你对数据表格进行显示、排序、筛选和操控。如jQuery表格排序插件、jQuery表格拖拽插件、jQuery树形表格插件、设置颜色、点击、替换等效果。1.DataTables-强大的jQuery表格插件DataTables是提供了大量特性的强大jQuery表格插...
实现可编辑的表格demo: 实例图: 代码: 代码如下:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <script type="text/jscript" src="jquery-1.4.2.min.js"></script> <script type="text/jscript" language="javascript"> //简化的ready写法:页面加载完成时候...
没什么技术含量,先上图: 思路: 1:获取按键 2:判断当前表格行的位置 HTML结构: 代码如下:<div id="formdiv" align="center"> firstname:<input type="text" id="firstname"/> lastname:<input type="text" id="lastname"/> age:<input type="text" id="age"/> percent:<input type="text" id="percent"/> <input type="button" value="确定" id="sure"/> </div> <table border="0" cellpadding="0" cellspacing="0" align="c...
下面就是我的“作品”啊,只是简单的实现其功能,并未做其他的功能啊 运行后,需要刷新下, 上面得代码比较简单,更多的例子,可以搜索脚本之家以前发布的文章。表头表头表头 脚本之家jb51.net4561263 1234567898794561263 1234567898794561263 1234567898794561263 1234567898794561263 1234567898794561263 1234567898794561263 1234567898794561263 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
下面是js Code: 代码如下:$(function() { // 相当于在页面中的body标签加上onload事件 $(".caname").click(function() { // 给页面中有caname类的标签加上click函数 var objTD = $(this); var oldText = $.trim(objTD.text()); // 保存老的类别名称 var input = $("<input type=text value=" + oldText + " />"); // 文本框的HTML代码 objTD.html(input); // 当前td的内容变为文本框 // 设置文本框的点击事件失效 input.click(fun...
//www.gxlcms.com/article/21027.htm不多说了,直接给代码 代码 代码如下:<html> <head> <title>双色表格</title> <style type="text/css"> <!-- table { border:solid 1px black; text-align:center; border-spacing:0px; } th,td { border:solid 1px black; width:100px; } --> </style> <script src="lib/jquery.js" type="text/javascript"></script> <script type="text/javascript" > $().ready(function() { $(tr:has(th))...
代码: 仿一个网友的代码写的,不记得出自哪里了,改成可以支持中文排序,而且支持控件value的排序。 没办法,能力有限,只能。。。 代码如下://转换器,将列的字段类型转换为可以排序的类型:String,int,float function convert(sValue, sDataType) { switch(sDataType) { case "int": return parseInt(sValue); case "float": return parseFloat(sValue); case "date": return new Date(Date.parse(sValue)); default: return sV...