今天遇到了一个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. [iOS微博项目 - 2.2] - 在app中获取授权

    github: https://github.com/hellovoidworld/HVWWeibo   A.发送授权请求 1.使用UIWebView加载请求页面 自定义一个继承UIViewContr ...

  2. apiCode/1/1.1/1.1.1

    public abstract class myClass { private string id = ""; private string name = "" ...

  3. HDU 3920Clear All of Them I(状压DP)

    HDU 3920   Clear All of Them I 题目是说有2n个敌人,现在可以发n枚炮弹,每枚炮弹可以(可以且仅可以)打两个敌人,每一枚炮弹的花费等于它所行进的距离,现在要消灭所有的敌人 ...

  4. DNS原理及其解析过程(转)

    转自(http://369369.blog.51cto.com/319630/812889) 网络通讯大部分是基于TCP/IP的,而TCP/IP是基于IP地址的,所以计算机在网络上进行通讯时只能识别如 ...

  5. Eclipse设置、调优、使用

    eclipse调优 一般在不对eclipse进行相关设置的时候,使用eclipse总是会觉得启动好慢,用起来好卡,其实只要对eclipse的相关参数进行一些配置,就会有很大的改善. 加快启动速度 1. ...

  6. 数据结构——图——最短路径D&F算法

    一.Dijkstra算法(贪心地求最短距离的算法) 在此算法中,我按照自己的理解去命名,理解起来会轻松一些. #define MAXSIZE 100 #define UNVISITED 0 #defi ...

  7. jQuery 的选择器

    本文来自网上转帖 1. 基础选择器 Basics 名称 说明 举例 #id 根据元素Id选择 $("divId") 选择ID为divId的元素 element 根据元素的名称选择, ...

  8. ADT下开发环境的配置--个人配置啦 Eclipse Color Themes

    一. Eclipse Color Themes的安装 首先 这个ADT没有Marketplace Client 需要装一个, 节选自: http://blog.csdn.net/liu37226700 ...

  9. OC:通讯录实战

    实战(使用OC的知识制作一个简易通讯录) //语法糖.笑笑语法 // NSString * string = [NSString stringWithFormat:@"string" ...

  10. 自定义Template,向其中添加新的panel

    参考网站:https://www.devexpress.com/Support/Center/Example/Details/E2690 思路: 新建一个DefaultTemplate:       ...