jQuery学习笔记(4)--Jquery中获取table中某列值的具体思路


Posted in Javascript onApril 10, 2013

花了一晚上的时间解决了一个看似很容易的问题。今晚做的这个东西中由于要获取某列中的一个ID值。如果是用平常的那种JS传值的方式此问题就不存在,但是由于此次用到的都是jquery插件,包括各种弹出框,用JS传值就得用JS那丑陋的弹出框,所以,你懂得。

网上找了很多方法,用起来都不行,后来想到了jquery中的鼠标事件,可以在鼠标经过table时,获得当前行与列的值。页面如下所示:
jQuery学习笔记(4)--Jquery中获取table中某列值的具体思路 
具体操作就是点击“删除”按钮,然后调用jquery插件页面,这时候需要获得相应行的“ID”进行操作。我的方法是:

先定义一个行数与列数的全局变量,然后在鼠标经过按钮时获得此行的行数与列数并付给此全局变量:

var trNum; 
var tdNum; 
$(function(){ 
//定义一个鼠标经过事件 
$('#users td').hover( 
function(){ 
//获得table的行号 
trNum = $(this).parent().parent().find('tr').index($(this).parent()[0])+ 1; 
//获得table的列号 
tdNum = $(this).parent().find('td').index($(this)[0])+ 1; 
} 
);

其中,“users”为此table的ID.然后再根据此ID进行业务处理,如下所示:
01.//点击“弹出框”选择“确定”后的业务处理 
$("#dialog-confirm").dialog({ 
autoOpen:false, 
resizable:false, 
height:150, 
modal:true, 
buttons:{ 
"确定":function(){ 
var au_id = $('#users').find('tr:eq(' + (trNum) + ')').find('td:eq(0)').text(); //获得对应第一列的ID值 
//业务处理省略 
…… 
}, 
"取消":function(){ 
$(this).dialog("close"); 
} 
}} 
);

小问题凝聚着大智慧,通过解决问题提高自己学习能力,解决问题的能力,是我一直崇尚的真理!
Javascript 相关文章推荐
jquery中的 $("#jb51")与document.getElementById("jb51") 的区别
Jul 26 Javascript
关于div自适应高度/左右高度自适应一致的js代码
Mar 22 Javascript
jquery、js操作checkbox全选反选
Mar 12 Javascript
使用jquery动态加载Js文件和Css文件
Oct 24 Javascript
全面解析Bootstrap表单使用方法(表单按钮)
Nov 24 Javascript
AngularJS 让人爱不释手的八种功能
Mar 23 Javascript
BootStrap中的表单大全
Sep 07 Javascript
浅析Node.js:DNS模块的使用
Nov 23 Javascript
AngularJS定时器的使用与移除操作方法【interval与timeout】
Dec 14 Javascript
让axios发送表单请求形式的键值对post数据的实例
Aug 11 Javascript
详解React 服务端渲染方案完美的解决方案
Dec 14 Javascript
vue自定义指令用法经典实例小结
Mar 16 Javascript
提示$ is not defined错误分析及解决
Apr 09 #Javascript
js 有框架页面跳转(target)三种情况下的应用
Apr 09 #Javascript
关于textarea提交的内容无法换行的解决办法
Apr 09 #Javascript
关于JQuery($.load)事件的用法和分析
Apr 09 #Javascript
关于JS判断图片是否加载完成且获取图片宽度的方法
Apr 09 #Javascript
关于JavaScript中的关联数组分析
Apr 09 #Javascript
分析Node.js connect ECONNREFUSED错误
Apr 09 #Javascript
You might like
Protoss建筑一览
2020/03/14 星际争霸
PHP函数spl_autoload_register()用法和__autoload()介绍
2012/02/04 PHP
仿Aspnetpager的一个PHP分页类代码 附源码下载
2012/10/08 PHP
PHP几个实用自定义函数小结
2016/01/25 PHP
PHP+sqlite数据库操作示例(创建/打开/插入/检索)
2016/05/26 PHP
用PHP的反射实现委托模式的讲解
2019/03/22 PHP
基于jQuery的360图片展示实现代码
2012/06/14 Javascript
JS操作JSON要领详细总结
2013/08/25 Javascript
Javascript学习笔记之 函数篇(三) : 闭包和引用
2014/11/23 Javascript
jQuery中get()方法用法实例
2014/12/27 Javascript
ionic开发中点击input时键盘自动弹出
2016/12/23 Javascript
JS验证字符串功能
2017/02/22 Javascript
Vue.js路由vue-router使用方法详解
2017/03/20 Javascript
微信小程序组件传值图示过程详解
2019/07/31 Javascript
如何通过javaScript去除字符串两端的空白字符
2020/02/06 Javascript
vue实现短信验证码输入框
2020/04/17 Javascript
Vue插槽_特殊特性slot,slot-scope与指令v-slot说明
2020/09/04 Javascript
[39:46]完美世界DOTA2联赛PWL S2 LBZS vs Rebirth 第二场 11.25
2020/11/25 DOTA
天翼开放平台免费短信验证码接口使用实例
2013/12/18 Python
Python操作MySQL数据库9个实用实例
2015/12/11 Python
Python入门教程之运算符与控制流
2016/08/17 Python
python如何求解两数的最大公约数
2018/09/27 Python
Django 开发调试工具 Django-debug-toolbar使用详解
2019/07/23 Python
Python3 venv搭建轻量级虚拟环境的步骤(图文)
2019/08/09 Python
opencv 实现特定颜色线条提取与定位操作
2020/06/02 Python
Django model重写save方法及update踩坑详解
2020/07/27 Python
CSS3用@font-face实现自定义英文字体
2013/09/23 HTML / CSS
美国网上鞋子零售商:Dr. Scholl’s Shoes
2017/11/17 全球购物
澳大利亚现代波西米亚风格女装网站:Bohemian Traders
2018/04/16 全球购物
英国标志性生活方式品牌:Skinnydip London
2019/12/15 全球购物
DC Shoes俄罗斯官网:美国滑板鞋和服饰品牌
2020/08/19 全球购物
手机促销活动方案
2014/02/05 职场文书
抽奖活动主持词
2014/03/31 职场文书
赔偿协议书怎么写
2015/01/28 职场文书
雨花台导游词
2015/02/06 职场文书
团组织关系介绍信
2019/06/24 职场文书