代码如下: html 代码如下: 1111 2222 4444 jquery代码: 代码如下: $(document).ready(function () { ModifyClick(); }); function ModifyClick() { $("table tr input[type='button'] ").each(function () { $(this).unbind("click"); $(this).bind("click", function () { if ($(this).val() == "添加下一行") { $(this).parent().parent().after("Add"); } if ($(this).val() == "删除下一行") { $(this).parent().par...
效果图:代码: 代码如下: $(function() { $("#Text1").keyup(function() { var filterText = $(this).val(); $("# tr").not(":first").hide().filter(":contains('" + filterText + "')").show();; }).keyup(); }); JQuery代码就: 代码如下: $(function() { $("#Text1").keyup(function() { var filterText = $(this).val(); $("# tr").not(":first").hide().filter(":contains('" + filterText + "')").show();;...
很多高手也位jquery写了专门的排序库,因为自己也想尝试一下, 当然运行速度实在不能接受,但是我会慢慢的把他改进的。 注:这里只是拿出了一部分代码来,查看演示demo 文档载入后给'th'添加click事件。 1. $('th').click(function(){ var date1=(new Date()).getTime() var dataType=$(this).attr('dataType'); 找到点击对象的自定义属性dataType,当然这个不符合W3C的标准是无法通过检验的,也可以用ID或者class来定义,但是我觉...
中文汉字排序、 中英文混合排序、 数据大小排序、 文件类型排序(后缀名排序) 日期时间排序、 价格排序、 中文混合数字排序; 使用方法:文档载入后new tableListSort(arguments,arguments)。 接受两个参数:第一个参数为必须的,可以是字符串ID,也可以是table对象;第二个可选参数,此参数为一个对象,{data:index,fileType:index,fn:function(){}};对象有三个可选的属性,第一个和第二个为扩展排序的数据类型,第三个参数为排序后需...
本篇作为开发学习笔记之一。 [文] 在web开发中经常遇到需要加亮鼠标指向的表格行的情况。首先说说一般的情况。 ·简单尝试 CSS2中允许我们对HTML元素使用hover伪类,这极大的方便了对于表格的样式的控制。 我们从一个小例子开始: XHTML(只列出了表格部分,请自行补完页面,本例在Transational的DTD下通过): 代码如下: Item Value 项目Item1 值Value1 项目Item2 值Value2 项目Item3 值Value3 项目Item4 值Value4 ...
代码如下: var picarry = {}; var lnkarry = {}; var ttlarry = {}; function FixCode(str){ return str.replace("","="); } var t=document.getElementById("pictable"); var rl=t.rows.length; var baseu= document.URL.replace(/(http.*\/)(.*)/, "$1"); if(baseu.indexOf("/servlet/")>=0) baseu = baseu.replace("/servlet/","/"); var txt=""; for(var i=0;i<rl;i++){ try{ picarry[i]=t.rows[i].cells[0].childNodes[0].src...
功能如下: 1.排序功能:单击行表头或列表头则进行正序排序;若再次单击,则进行逆序; 2.修改功能:双击某个单元格,则可进行输入操作,当输入框失去焦点时,则新数据被保存; 3.随机功能:每次刷新页面,表格中的数据都不一样; 效果图: 完整源码如下: 二维排序表格 * { font-family: Tahoma, Arial, Serif; font-size: 14; } body { text-align: center; min-width: 760px; } #main { width: 720px; margin: 0 ...
这段JS放在head中 代码如下: //点击当前选中行的时候设置当前行的颜色,同时恢复除当前行外的行的颜色及鼠标事件 function selectRow(target) { var sTable = document.getElementById("ServiceListTable") for(var i=1;i<sTable.rows.length;i++) //遍历除第一行外的所有行 { if (sTable.rows[i] != target) //判断是否当前选定行 { sTable.rows[i].bgColor = "#ffffff"; //设置背景色 sTable.rows[i].onmouseover = resumeRowOv...
效果图:编写JQUERY插件如下: 代码如下: ;(function($) { $.fn.extend({ "alterBgColor":function(options){ //设置默认值 option=$.extend({ odd:"odd", even:"even", selected:"selected" },options); //注意这个options 同上面的function(options)中的option是同一个对象 //隔行变色 $("tbody>tr:enev",this).addClass(option.even); $("tbody>tr:odd",this).addClass(option.odd); //单击行变色 $(tbody>tr,this).click(funct...
图(1.1) 某物流信息系统中的功能要求如图1.1所示,表格中每一行代表一笔运送货物的信息,在录入每行的计费重量和费率后,要求能按一定的公式,自动计算运送费用,并且能自动统计所有运送货物的总运费。运送货物信息的数据量(即表格的行数)不定,要求能动态增加、删除,即表格的数据行数是动态可维护的。同时为了方便操作,需要在页面中能像使用键盘的上下左右方向键,在录入的文本框之间进行切换。每行的数据有一定的校验要求,比如...
代码很简单,在附件中,各位可以下载后直接运行. 代码如下: $(function() { jQuery.fn.alternateRowColors = function() { //做成插件的形式 $('tbody tr:odd', this).removeClass('even').addClass('odd'); //隔行变色 奇数行 $('tbody tr:even', this).removeClass('odd').addClass('even'); //隔行变色 偶数行 return this; }; $('table.myTable').each(function() { var $table = $(this); //将table存储为一个jquery对象 $tab...
下载代码和示例:jqueryPaging.rar 使用方法如下: 代码如下: $("#myTable").tablePaging({ pageSize: 5, sorting: true, sortSelector: ".js-Order", sortType: "number" }); 如果仅仅用分页功能:$("#myTable").tablePaging(); 参数说明: id: jQuery(this).attr('id'), // 要分页的表格的ID pageSize: 10, // 单个页面显示记录数,默认是10条 sorting: false,//是否要进行排序,默认不排序 sortDirection: 'asc', //排序顺序...
效果图: 当下拉框改变的时候,添加一个成人填写信息或儿童填写信息! 代码如下: 无标题文档 *{ font-size:12px; } #dFlightContent1 { width: 704px; height:auto; border-bottom: 1px solid #B0CAED; border-left: 1px solid #B0CAED; border-right: 1px solid #B0CAED; overflow: hidden; } .w_tt { font-size:14px; color:#006699; margin:0px 4px; } .w_tit { width:85px; text-align:right; } .w_uinfo { width:500p...
ONE 已经生成的数据表格大致内容如下:地区 地区 商品代码 商品名称 数量 有效期至 距效期(月) 产品批号 规格 单位 条形码广东 深圳 00028 红花油广东 深圳 00028 红花油广东 深圳 00028 红花油广东 广州 00027 白花油广东 广州 00028 红花油广东 深圳 00028 红花油广东 深圳 00028 红花油广东 深圳 00028 红花油广东 深圳 00028 红花油需要将前四列具有相同文本的相邻单元格进行自动合并,合并后如下:地区 地区 商品代码 商品名...
在这里我们需要控制用户的输入验证,表格的添加删除,用户输入数据的统计聚合,还有相应的计算列比如商品的总价=商品的单价*商品数量,再如,同时在用户提交的时候我还要需要获取提交到后台服务端处理在存储到我们的数据库。本插件则简单的处理了这些繁琐的事情。 插件属性说明: 1:rowTemplate:这是插入列的模板,在模板中我们的序号这种行号标示的需要rownum 的class。在模板中的需要唯一编号的比如我们的radiobutton的name属性...