添加行
function addSingleRow(styleid, desc, styletype, quality, analyse, size, rate,
weistr, weiend, weiavg) {
//bodyTbl -->table 元素 可以用document.getElementById("ID名字")获取,
//当然获取方式很多,添加行也不一定要这么写,可以用appendChild方法添加
var myrow = bodyTbl.insertRow();
var cell = myrow.insertCell();
cell.innerHTML = "";
var cell = myrow.insertCell();
cell.innerHTML = "<span>" + desc + "</span>";
var cell = myrow.insertCell();
cell.innerHTML = "<input type='hidden' name='styleid' value='" + styleid
+ "'/>" + "<span>" + styletype + "</span>";
cell = myrow.insertCell();
cell.innerHTML = "<input type='hidden' name='quality' value='" + quality[0]
+ "'/>" + "<span>" + quality[1] + "</span>"
cell = myrow.insertCell();
cell.innerHTML = "<input type='hidden' name='analyse' value='" + analyse[0]
+ "'/>" + "<span>" + analyse[1] + "</span>";
cell = myrow.insertCell();
cell.innerHTML = "<input type='hidden' name='size' value='" + size[0]
+ "'/>" + "<span>" + size[1] + "</span>";
cell = myrow.insertCell();
cell.innerHTML = "<input type='hidden' name='rate' value='" + rate[0]
+ "'/>" + "<span>" + rate[1] + "</span>";
cell = myrow.insertCell();
cell.innerHTML = "<input type='text' style='width:80px' value='" + weistr
+ "' name='startwei'>";
cell = myrow.insertCell();
cell.innerHTML = "<input type='text' style='width:80px' value='" + weiend
+ "' name='endwei'>";
cell = myrow.insertCell();
cell.innerHTML = "<input type='text' style='width:80px' value='" + weiavg
+ "' name='avgwei'>";
cell = myrow.insertCell();
cell.innerHTML = "<input type='button' value='删除' class='bt_a' onclick='deleteRow()'>";
}
删除行
function deleteRow() {
if (!confirm("确定删除?"))
return;
//event好像是IE特有的,在firefox估计会出问题
var index = event.srcElement.parentNode.parentNode.rowIndex;
bodyTbl.deleteRow(index - 1);
setRowNum();
}
function setRowNum() {
for ( var i = 0; i < bodyTbl.rows.length; i++) {
bodyTbl.rows[i].cells[0].innerHTML = (i + 1);
}
}
分享到:
相关推荐
1. **HTML表格(Table)**: HTML表格用于在网页上展示结构化的数据,通过`<table>`标签定义,`<tr>`表示行,`<td>`或`<th>`表示单元格。要导出的数据首先需要在HTML中以表格的形式呈现。 2. **JavaScript**: ...
【IE6升级到IE9兼容性问题和操作手册】 在互联网技术不断发展的今天,老旧的浏览器版本如IE6已经无法满足现代网页的需求。因此,升级到更现代的版本,如IE9,是必要的。然而,这个升级过程并非一帆风顺,会涉及到...
本话题将深入探讨“js表头固定”这一技术,主要关注如何使用JavaScript和jQuery来实现固定table标题行的功能。 首先,我们来看"jquery表头固定"。jQuery是一个轻量级、功能丰富的JavaScript库,它简化了HTML文档...
Bootstrap-table.js 是一个基于Bootstrap框架的前端数据展示插件,它允许用户在网页上创建功能丰富的、可操作的表格。这个插件的核心理念是提供一个简单而强大的方式来展示动态数据,同时保持良好的用户体验和响应式...
"基于jQuery的table表头固定"通常涉及到以下关键技术点: 1. **分离表头和主体**:首先,我们需要将HTML表格的thead部分与tbody部分分离,这样在进行滚动操作时,thead可以独立于tbody进行定位。 2. **CSS定位**:...
Bootstrap Table控件是一款基于Bootstrap框架的开源前端组件,它为网页设计者和开发者提供了一种简单、可定制的表格展示方案。这款控件不仅具备基本的表格功能,如数据展示,还支持高级特性,如分页、搜索查询、刷新...
BootstrapTable 是一个基于 Bootstrap 框架的前端数据表格插件,它提供了丰富的功能,如分页、排序、过滤、自定义列等。在实际应用中,有时我们需要根据数据显示的需求调整列宽,以便更好地查看和理解表格内容。...
4. 兼容性问题:由于JavaScript库通常是基于现代浏览器的API实现,所以可能不支持较旧的浏览器,如IE。为确保跨浏览器兼容性,可能需要引入polyfill库,或者寻找支持IE的表格导出解决方案。 5. 文件下载:当`table2...
Table2Excel是基于jQuery的一个插件,它的主要任务是从网页中的表格元素(table)导出数据到Excel文件,方便用户进行进一步的处理或存储。 原始的Table2Excel插件可能存在不兼容IE浏览器或者产生安全提示的问题。...
4. **兼容性处理**:为了确保插件能在各种浏览器上正常工作,"jquery.fixedtable.js"已经考虑了主流浏览器(如IE6及其以上版本、Firefox、Chrome和Opera)的兼容性问题,这通常涉及到对不同浏览器的CSS和JavaScript...
2. **表格(Table)操作**:在HTML中,表格由`<table>`、`<tr>`(行)、`<td>`(单元格)等元素构成。jQuery可以方便地选择、添加、删除或修改这些元素。例如,`$('table tr').sort(function(a, b){...})`可以对表格...
然而,在IE中,当`table`元素的`position`被设置为非`static`时,可能会破坏其默认的布局行为,特别是在与`select`元素结合使用时,可能会导致`select`下拉菜单无法正常显示或操作。 `select`元素是用来创建下拉...
**E6升级到IE9兼容性问题和操作手册** 在从IE6升级到IE9的过程中,开发者需要面对一系列兼容性挑战,涉及到JavaScript、DOM、HTML和CSS等多个方面。以下是详细的知识点解析: **第一章:HTML** **第一节:IE7-IE8...
本文将详细介绍一个基于JavaScript的小组件,该组件实现了原生HTML `<table>` 的排序功能,兼容IE、Firefox、Opera和Chrome等主流浏览器。这个小组件通过简单的HTML标记和JavaScript脚本实现,使得用户可以通过点击...
jQuery Table2Excel插件是基于jQuery的一个轻量级库,其核心功能在于将HTML表格转换为Excel文件格式。该插件支持多种浏览器,包括IE8+,以及现代的Chrome、Firefox、Safari和Edge等。1.1.2版本在前一版本的基础上...
Bootstrap是世界上最流行的...通过使用这些资源,开发者可以确保在IE8环境下也能正确地展示和操作Bootstrap构建的网页。在不断变化的Web技术中,对老版本浏览器的支持虽然不再主流,但仍然是某些场景下不可忽视的需求。
fixed-table.js插件是基于jQuery框架构建的,因此在使用前需要确保项目中已经引入了jQuery库。这个插件的核心功能是将表格的表头部分(thead)锁定在视口顶部,即使在表格内容滚动时也能保持可见,这在处理大数据量...
这个插件基于jQuery库,使得在网页上实现表格数据的Excel导出功能变得简单易行。在本篇文章中,我们将深入探讨`jQuery Table2Excel`的使用方法、原理以及如何在实际项目中集成。 首先,我们来看一下`jQuery.table2...
- 最后,将所有元素包装在一个`div`中返回,以形成Table的一行。 4. **自定义渲染**: Vue的自定义渲染允许开发者灵活地控制组件的呈现方式,这里利用了`h`函数来创建和组合Vue组件。`h('组件名', {属性对象}, ...
此外,还有其他库如jQuery,可以帮助弥补IE6在DOM操作和事件处理上的不足。 5. **渐进增强和优雅降级**:在设计时,应采用渐进增强策略,确保基础功能在所有浏览器下可用,然后为现代浏览器添加增强功能。对于IE6...