Jqeury获取table当前行与指定列
今天遇到了一个Jqeury获取table当前行与指定列的问题:
大概的实现要求是一个页面中,上面有几个input输入框,下面有一个table,当在输入框中输入内容的时候,点击添加按钮的时候,在下面table中追加对应的代码,同时每行有 编辑、删除的操作。类似下面的页面操作:
下面是addTable(),就是点击按钮之后追加tr的操作
function addTable() {
………………
//得到每个input的值
var goodsClassVar = $("#goodsClass").val();
var goodsSubClassVar = $("#goodsSubClass").val();
var pcsVar = $("#pcs").val();
var classifierVar = $("#classifier").val();
var remarkVar = $("#remark").val();
var rAwbState = $("#resultAwbState").val();
// 追加html语句
var tr = "<tr><td style=\"display: none\">" + id + "</td><td name=\"goodsClass\">" + goodsClassVar + "</td><td name=\"goodsSubClass\">" + goodsSubClassVar + "</td><td name=\"pcs\">" + pcsVar +
"</td><td name=\"classifier\">" + classifierVar + "</td><td name=\"remark\">" + remarkVar + "</td><td>" +
"<a class=\"bs-btn bs-btn-sm bs-btn-default\" name=\"edit\" onclick=\"editTable(this)\"><span>编辑</span></a>" +
"<a class=\"bs-btn bs-btn-sm bs-btn-default\" name=\"del\" onclick=\"delTable(this)\"><span>删除</span></a>" + "</td></tr>";
$("#tablelist").append(tr);
………………
}
添加数据之后的table样式如下面所示:
之后是要求点击“编辑”按钮之后,获得当前行的信息,当然上面的代码中可以看出我是把信息的主键id所在的td列给隐藏了。下面就是editTable()的函数,点击编辑的操作:
function editTable(id) {
//得到当前所在行
var rows = id.parentNode.parentNode.rowIndex;
//得到所在行的第一列的内容
var recId = $("#tablelist tr:eq(" + rows + ") td:eq(0)").html() }
主要的方法就是 $("table的id tr:eq(第几行) td:eq(第几列)").html()
因为对JQuery的知识懂得非常的少,今天的这个小小的问题困扰了我好久,就记录下来,以防以后忘记。当然能帮助到别人更好!
Jqeury获取table当前行与指定列的更多相关文章
- jquery获取table的行数、列数
$("#grd").find("tr").length; //行数 $("#grd").find("tr").find( ...
- table 中实现 控制 指定列的 左对齐 右对齐方式
.listTable{ border-collapse:collapse; border-top:1px solid #8c9594; border-right:1px solid #8c9594; ...
- jquery 获取table当前行值
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...
- Jquery 获取table当前行内容
$("a[name='checkOriginal']").click(function () { var parent = $(this).parent().parent().fi ...
- js循环获取table中的值
<script type="text/javascript"> function getTdValue() { var tableId = document.getEl ...
- 用JavaScript,获取Table中指定的行、列
前言: 先要谢谢George Wing的慷慨赠书<悟透JavaScript>,让我更加感受到了技术交流的重要性,呵呵~ 进入正题,面试题中有一题:如何通过JavaScript获取Table ...
- jquery获取table指定行和列的数据(当前选中行、列)
//不多说,直接上代码.$("table tr").click(function() {//为表格的行添加点击事件 var tr = $(this);//找到tr原色 var td ...
- 使用laravel的Eloquent模型获取数据库的指定列
使用laravel的Eloquent模型获取数据库的指定列 使用Laravel的ORM——Eloquent时,时常遇到的一个操作是取模型中的其中一些属性,对应的就是在数据库中取表的特定列. 如果使 ...
- DataTable相关操作,筛选,取前N条数据,去重复行,获取指定列数据
#region DataTable筛选,排序返回符合条件行组成的新DataTable或直接用DefaultView按条件返回 /// <summary> /// Dat ...
随机推荐
- Python基础 练习题
DAY .1 1.使用while循环输出 1 2 3 4 5 6 8 9 10 n = 1 while n < 11: if n == 7: pass else: print(n) n ...
- DMOZ介绍以及如何提交
转载自 http://www.cnblogs.com/freespider/archive/2009/12/28/1633818.html Dmoz介绍及怎么提交? 1.Dmoz目录简介: Dmoz是 ...
- android 二维码生成+扫描
android 二维码生成+扫描 1.在Android应用当中,很多时候都要用到二维码扫描,来避免让用户手动输入的麻烦. Google官方自己推出了一个二维码开源项目:ZXing库. 2.这里简单介绍 ...
- 常见Java基础知识(较长)
1.抽象: 抽象就是忽略一个主题中与当前目标无关的那些方面,以便更充分地注意与当前目标有关的方面.抽象并不打算了解全部问题,而只是选择其中的一部分,暂时不用部分细节.抽象包括两个方面,一是过程抽象, ...
- 浅谈Oracle函数返回Table集合
在调用Oracle函数时为了让PL/SQL 函数返回数据的多个行,必须通过返回一个 REF CURSOR 或一个数据集合来完成.REF CURSOR 的这种情况局限于可以从查询中选择的数据,而整个集合 ...
- 【官方文档】Hadoop分布式文件系统:架构和设计
http://hadoop.apache.org/docs/r1.0.4/cn/hdfs_design.html 引言 前提和设计目标 硬件错误 流式数据访问 大规模数据集 简单的一致性模型 “移动计 ...
- ARM&Linux 下驱动开发第一节(小试牛刀)
#include<linux/init.h> #include<linux/module.h> static int __init hello_init(void) { pri ...
- cdoj 93 King's Sanctuary 傻逼几何题
King's Sanctuary Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://acm.uestc.edu.cn/#/problem/sho ...
- Codeforces Round #308 (Div. 2) D. Vanya and Triangles 水题
D. Vanya and Triangles Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/contest/55 ...
- ubuntu全盘备份与恢复
备份: 以下是我用来备份系统的完整命令: tar -jpcvf Ubuntu-12.04-20131018.tar.bz2 --exclude=/proc --exclude=/lost+found ...