今天遇到了一个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当前行与指定列的更多相关文章

  1. jquery获取table的行数、列数

    $("#grd").find("tr").length; //行数 $("#grd").find("tr").find( ...

  2. table 中实现 控制 指定列的 左对齐 右对齐方式

    .listTable{ border-collapse:collapse; border-top:1px solid #8c9594; border-right:1px solid #8c9594; ...

  3. jquery 获取table当前行值

    <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...

  4. Jquery 获取table当前行内容

    $("a[name='checkOriginal']").click(function () { var parent = $(this).parent().parent().fi ...

  5. js循环获取table中的值

    <script type="text/javascript"> function getTdValue() { var tableId = document.getEl ...

  6. 用JavaScript,获取Table中指定的行、列

    前言: 先要谢谢George Wing的慷慨赠书<悟透JavaScript>,让我更加感受到了技术交流的重要性,呵呵~ 进入正题,面试题中有一题:如何通过JavaScript获取Table ...

  7. jquery获取table指定行和列的数据(当前选中行、列)

    //不多说,直接上代码.$("table tr").click(function() {//为表格的行添加点击事件 var tr = $(this);//找到tr原色 var td ...

  8. 使用laravel的Eloquent模型获取数据库的指定列

    使用laravel的Eloquent模型获取数据库的指定列   使用Laravel的ORM——Eloquent时,时常遇到的一个操作是取模型中的其中一些属性,对应的就是在数据库中取表的特定列. 如果使 ...

  9. DataTable相关操作,筛选,取前N条数据,去重复行,获取指定列数据

    #region DataTable筛选,排序返回符合条件行组成的新DataTable或直接用DefaultView按条件返回      /// <summary>      /// Dat ...

随机推荐

  1. 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 ...

  2. DMOZ介绍以及如何提交

    转载自 http://www.cnblogs.com/freespider/archive/2009/12/28/1633818.html Dmoz介绍及怎么提交? 1.Dmoz目录简介: Dmoz是 ...

  3. android 二维码生成+扫描

    android 二维码生成+扫描 1.在Android应用当中,很多时候都要用到二维码扫描,来避免让用户手动输入的麻烦. Google官方自己推出了一个二维码开源项目:ZXing库. 2.这里简单介绍 ...

  4. 常见Java基础知识(较长)

    1.抽象:  抽象就是忽略一个主题中与当前目标无关的那些方面,以便更充分地注意与当前目标有关的方面.抽象并不打算了解全部问题,而只是选择其中的一部分,暂时不用部分细节.抽象包括两个方面,一是过程抽象, ...

  5. 浅谈Oracle函数返回Table集合

    在调用Oracle函数时为了让PL/SQL 函数返回数据的多个行,必须通过返回一个 REF CURSOR 或一个数据集合来完成.REF CURSOR 的这种情况局限于可以从查询中选择的数据,而整个集合 ...

  6. 【官方文档】Hadoop分布式文件系统:架构和设计

    http://hadoop.apache.org/docs/r1.0.4/cn/hdfs_design.html 引言 前提和设计目标 硬件错误 流式数据访问 大规模数据集 简单的一致性模型 “移动计 ...

  7. ARM&Linux 下驱动开发第一节(小试牛刀)

    #include<linux/init.h> #include<linux/module.h> static int __init hello_init(void) { pri ...

  8. cdoj 93 King's Sanctuary 傻逼几何题

    King's Sanctuary Time Limit: 20 Sec  Memory Limit: 256 MB 题目连接 http://acm.uestc.edu.cn/#/problem/sho ...

  9. 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 ...

  10. ubuntu全盘备份与恢复

    备份: 以下是我用来备份系统的完整命令: tar -jpcvf Ubuntu-12.04-20131018.tar.bz2 --exclude=/proc --exclude=/lost+found ...