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...
在很多web应用中，我们会遇到很多需要动态插入多行纪录的地方。比如，在人才网站上，我们填写简历的时候，我们要填写我们的项目经验，我们可以根据自己的实际情况动态的添加条数，这种不是以单独页面的形式添加，这种动态添加是在同一个页面下动态添加，最后再一起提交到服务器保存到数据库中。 本文，我将以一个类似的例子来做一个前台用Javascript动态添加数据项，后台保存到数据库的例子。 浏览器：IE.6.0 后台：ASP (VBScript ...
段时间做项目时候由于需要显示一个列表，但是由于数据太多在滚动的时候表头必须冻结住，所以就写了下面这个脚本（曾经在网上也找过相应的脚本，但是不怎么理想所以就自己写了，但是目前由于项目仅仅用到了表头的冻结，而不需要指定列冻结所以目前只能算个不完整的脚本，不过一般的仅仅需要表头冻结就可以使用了），现在先看看截图： 这样实现了表头的冻结，下面表体内容可以自由滚动 看下代码： //为jquery扩展一个CloneTableHeade...
Table body{ font-size:12px} #tab{ border-collapse: collapse;} .edit{ height:16px; width:98%; background-color:#EFF7FF; font-size:12px; border:0px;} #tab thead td{ background:url(/upload/201005/20100531233452190.bmp);color:#183C94} #tab tbody td{ overflow:hidden} #tab td{border: 1px solid #CECFCE;height:20px;line-height:20px;vertical-align:middle; } #tab td.tc{text-align:center;} .cc{width:1...
未添加行之前： 添加行之后： 演示代码:给表格内部动态添加行 .tableStyle { border-collapse: collapse; width:100%; } td { font-size:12px; height:25px; border:1px solid #CCD5E8; } .btn { font-size:12pt; color: #003399; border: 1px #003399 solid; color:#006699; border-bottom: #93bee2 1px solid; border-left: #93bee2 1px solid; border-right: #93bee2 1px solid; border-top: #93bee2 1px sol...
代码如下: function wordcontorl(){ alert("小孟佳的宝贝"); var WordApp=new ActiveXObject("Word.Application"); var wdCharacter=1 var wdOrientLandscape = 1 WordApp.Application.Visible=true; //执行完成之后是否弹出已经生成的word var myDoc=WordApp.Documents.Add();//创建新的空文档 WordApp.ActiveDocument.PageSetup.Orientation = wdOrientLandscape//页面方向设置为横向 WordApp. Selection.ParagraphFormat.Alignm...
本文实例介绍了JS实现动态生成表格并向后端提交表格数据的相关代码，分享给大家供大家参考，具体内容如下 先来看一下需求：在web页面上动态的生成表格，并可以对表格中的数据进行编辑，然后把表格中的数据提交至后端服务器保存。 那么我们首先需要解决的是动态生成表格的问题 1.首先我们需要导入JS库文件。2.然后在页面div中事先创建一个空白表格，可以根据需求而定，我这里是一个带表头的表格表头1表头2表头3表头4表头5操作3.表格...
又一个动态控制表格的效果，用JavaScript动态生成表格行、表格列，以及还可动态删除这些行列，行等，运行代码后，点击对应的功能按钮，即可实现对应的表格操作功能。1.jsp产品名称 编号 数量 重量 操作添加行2.js//添加行 function addTable(){ var tab=document.getElementById("viewTabs"); //获得表格 var colsNum=tab.rows.item(0).cells.length; //表格的列数 //表格当前的行数 var num=document.getElementById("viewTabs")...
本文实例讲述了基于jQuery实现的无刷新表格分页。分享给大家供大家参考，具体如下： 效果图如下：html结构：css样式：html,body{margin: 0;padding:0} a:focus {outline: none;} /* 通用表格显示 */ table, th, td {font: 12px Arial,Helvetica,sans-serif,宋体;margin: 0;padding: 0} table{border-spacing: 0;border-collapse: collapse;} .datatable {width: 100%;border-style: none;background-color: #fff;margin-bottom: 20...
本文实例讲述了jQuery插件实现表格隔行变色及鼠标滑过高亮显示效果的方法。分享给大家供大家参考，具体如下： 此插件旨在实现表格隔行变色，且鼠标移动在表格的某一行上时，该行能高亮显示。整体代码如下：表格隔行变色且鼠标滑过高亮显示table{border-collapse:collapse;border:none;width:20%;} table tr td{border:1px solid #ccc;text-align:center;cursor:pointer;} .evenRow{background:#f0f0f0;} .oddRow{background:#ff0;}...
本文实例讲述了jQuery实现获取table表格第一列值的方法。分享给大家供大家参考，具体如下： 先来看看运行效果截图：完整代码如下：无标题页$(function(){$("#Button1").click(function(){var cols="";$("#tb tr").each(function(){var text = $(this).children("td:first").text();cols+=text+"|";})cols=cols.length>0cols.substring(0,cols.length-1):"";alert(cols);}) })IdNameAddress11leafgz22flowergz更多关于jQuery相关内容...
本文实例讲述了JS动态增删表格行的方法。分享给大家供大家参考，具体如下：function insertRow(tableName,className,bgcolor, cellContentArray){var t = document.getElementByIdx(tableName); //取得table表var tr = t.insertRow(); //插入一行tr.className=className; //设置行的csstr.bgcolor=bgcolor; //设置行的背景颜色for( var i=0;i更多关于JavaScript相关内容感兴趣的读者可查看本站专题：《JavaScript查找算法技巧总...
DataTables是一个jQuery的表格插件，本文为大家分享了表格插件datatables用法，介绍了基础的部分知识，具体内容如下 一、初始化 在页面中Column 1Column 2Row 1 Data 1Row 1 Data 2Row 2 Data 1Row 2 Data 2js中初始化$(document).ready( function () {$('#table_id').DataTable(); } );二、常用配置 在初始化的时候可以通过一些常用的配置项对表格进行配置，这是我在项目中实际用到的$("#vivo_table_list").dataTable({pageLength...
官方网站：http://www.flexigrid.info/ 今天比较空闲，所以花了点时间用flexigrid做了简单例子，基于PHP，可以直接在支持PHP的环境里实验效果。 下载地址：http://xiazai.jb51.net/201007/yuanma/flexigrid.rar
固定表头 列宽可调整 单击列头可排序 双击单元格可编辑 可绑定数据源 看下效果吧:HTML - 模板代码： 代码如下: 姓名 性别 年龄 住址 {姓名} {性别} {年龄} {住址} jsascript代码： 代码如下: //测试数据 var dataJsonStr={tablename:"",rows:[{"姓名":"曹操","性别":"男","年龄":"51","住址":"许昌"},{"姓名":"诸葛亮","性别":"男","年龄":"40","住址":"南阳"},{"姓名":"周瑜","性别":"男","年龄":"40","...