最近做了一个项目,使用了jquery来操作表格,其实也没什么太多的技术点,只是自己记录一下,方便自己以后碰到类似的问题有一个参照。废话不说了,大家看看效果先.
JS 代码如下:
var myTBody=null;
$(function() {
//ajax请求拿到产品的数组
myTBody=$("#content_TBody");
});
var tableObjectID = 0;
function addTR(templateId,containerId) {
var tr = $("#"+templateId).clone();
tr.attr("id", tableObjectID);
setID(tr);
tr.show();
$("#"+containerId).append(tr);
addJsonSuggest(containerId);
}
function deleteTR(a) {
$($(a)[0].parentNode.parentNode).remove();
revertID();
}
function revertID(containerId) {
tableObjectID = 0;
$("#"+containerId+" tr").each(function(index) {
setID($(this));
});
}
function setID(tr) {
tr.find("input, select, textarea")
.not(":submit, :reset, :image, [disabled]").each(function(i){
this.id = this.id.replace(/\d/, tableObjectID);
this.name = this.name.replace(/\d/, tableObjectID);
});
tableObjectID++;
}
function addJsonSuggest(containerId){
var installstaffs = $("#"+containerId+" input[id^=sku_]");
installstaffs.each(function(i){
if(this.id){
var id = this.id;
$(this).unbind();
$('#'+id).jsonSuggest({url: 'datas.txt', maxResults: 10});
}
});
}
分享到:
相关推荐
数据展示时候,经常从后台传入大小不等的矩阵。这里给出了根据不同矩阵大小,通过jquery的html()和append()方法动态生成html表格的实例。
《jQuery动态创建表格生成器代码详解》 在Web开发中,动态生成表格是常见的需求,尤其是在数据展示和交互性较强的应用场景中。jQuery作为一个轻量级的JavaScript库,以其简洁的API和强大的功能深受开发者喜爱。本文...
在这个场景中,我们关注的是如何使用 jQuery 动态创建表格,并且为表格的每个单元格赋予随机背景颜色。这通常用于增强用户界面的视觉吸引力,或者在数据展示时提供更直观的区分。 首先,我们需要理解 jQuery 如何...
jquery动态创建表格中的行、删除指定行
通过jQuery,可以动态创建这些元素并将其插入到表格中。以下是一个简单的示例: ```html 姓名 年龄 添加行 $(document).ready(function() { $("#addRow").click(function() { var newRow = $...
本教程将详细讲解如何使用jQuery库来实现表格的动态分页,同时结合Java后端进行数据的动态查询和分页处理。 首先,让我们了解动态分页的基本原理。动态分页是指在用户滚动或点击分页按钮时,仅加载当前显示的数据,...
本教程将深入探讨如何使用jQuery实现动态更改table表格数据,让你的网页表格具有实时编辑功能,提升用户体验。 首先,我们需要理解HTML表格的基本结构。一个基本的表格由`<table>`元素开始,包含若干个`<tr>`(行)...
jQuery创建动态事件是这个领域中的一个重要概念,它允许我们根据需要动态地添加和管理事件监听器,为网页元素提供响应用户行为的能力。 jQuery的核心优势之一就是其简洁的API,这在处理事件方面尤为明显。传统的...
通过学习和实践“jQuery动态表格检索排序代码”,开发者可以掌握如何创建高性能、交互性强的表格组件,这对于任何前端开发者来说都是一项重要的技能。 总结来说,这个压缩包提供了一个完整的解决方案,包括动态加载...
可以输入单价计算出金额,输入金额反算单价,统计合计功能支持键盘左右上下移动功能。
### jQuery+ajax实现动态添加表格tr td功能 在进行Web开发时,我们经常需要动态地从服务器获取数据,并将这些数据展示在网页上。表格是展示这些数据的一种常见形式。本文将详细解析使用jQuery和ajax技术来实现动态...
本篇文章将深入探讨如何使用jQuery来动态地给HTML表格(table)赋值,通过一个具体的实例来展示相关技巧。 首先,我们需要一个基本的HTML结构,包含一个具有特定类和ID的table元素。在这个例子中,我们有一个layui...
在使用JQuery来实现动态表格增加行的场景中,主要涉及到的技术点包括: 1. DOM操作:文档对象模型(DOM)允许我们通过编程语言来操作HTML文档的结构、样式和内容。在这个例子中,DOM操作用于动态地向表格中插入新的...
在创建分页动态数据表格时,jQuery提供了丰富的API和函数,使得开发者可以快速构建具有交互性的表格。 分页功能是通过计算总数据量和每页显示的数据行数来实现的。通常,插件会有一个配置选项,允许开发者设置默认...
总的来说,这个压缩包提供了使用jQuery和JSON动态生成表格的示例,包括从服务器获取数据、动态创建和更新表格、以及实现表格行的折叠和展开功能。这些技术对于开发响应式、交互性强的网页界面非常有用。
本示例“jquery表格动态添加删除行代码”利用jQuery的强大功能,为用户提供了一个直观且用户友好的表格管理体验。这个代码实现了一个功能,即在表格中动态地添加和删除行,这对于数据展示和编辑是非常实用的。 首先...
在文章“jquery 操作动态表格”中,作者可能详细讲解了上述知识点,并通过实例代码演示了如何创建、更新和管理动态表格。通过阅读这个博客(链接:https://jsufly.iteye.com/blog/758925),开发者可以学习到实用的...