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 相关文章推荐
DIY jquery plugin - tabs标签切换实现代码
Dec 11 Javascript
简单易用的倒计时js代码
Aug 04 Javascript
javascript实现字符串反转的方法
Feb 05 Javascript
轻松学习jQuery插件EasyUI EasyUI实现拖动基本操作
Nov 30 Javascript
浅谈JS验证表单文本域输入空格的问题
Feb 14 Javascript
angularjs+bootstrap实现自定义分页的实例代码
Jun 19 Javascript
JavaScript实现元素滚动条到达一定位置循环追加内容
Dec 28 Javascript
vue js秒转天数小时分钟秒的实例代码
Aug 08 Javascript
jQuery选择器之基本选择器用法实例分析
Feb 19 jQuery
js实现多个倒计时并行 js拼团倒计时
Feb 25 Javascript
结合axios对项目中的api请求进行封装操作
Sep 21 Javascript
ES6 解构赋值的原理及运用
May 25 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
Zend Framework教程之Loader以及PluginLoader用法详解
2016/03/09 PHP
PHP数字前补0的自带函数sprintf 和number_format的用法(详解)
2017/02/06 PHP
jquery 选项卡效果 新手代码
2011/07/08 Javascript
jquery实现简单的拖拽效果实例兼容所有主流浏览器
2013/06/21 Javascript
Jquery全选与反选点击执行一次的解决方案
2015/08/14 Javascript
JS实现超精简的链接列表在固定区域内滚动效果代码
2015/11/04 Javascript
jQuery检测滚动条是否到达底部
2015/12/15 Javascript
分享12个实用的jQuery代码片段
2016/03/09 Javascript
jQuery绑定事件-多种实现方式总结
2016/05/09 Javascript
webpack构建换肤功能的思路详解
2017/11/27 Javascript
vue中利用Promise封装jsonp并调取数据
2019/06/18 Javascript
JavaScript canvas绘制圆弧与圆形
2020/02/18 Javascript
js实现简单的贪吃蛇游戏
2020/04/23 Javascript
使用Webpack 搭建 Vue3 开发环境过程详解
2020/07/28 Javascript
[57:53]Secret vs Pain 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/20 DOTA
[01:11:46]DOTA2-DPC中国联赛 正赛 iG vs Magma BO3 第一场 2月23日
2021/03/11 DOTA
使用python实现baidu hi自动登录的代码
2013/02/10 Python
如何解决django配置settings时遇到Could not import settings 'conf.local'
2014/11/18 Python
Python使用爬虫抓取美女图片并保存到本地的方法【测试可用】
2018/08/30 Python
PyQt4 treewidget 选择改变颜色,并设置可编辑的方法
2019/06/17 Python
python 利用turtle模块画出没有角的方格
2019/11/23 Python
python GUI库图形界面开发之PyQt5中QMainWindow, QWidget以及QDialog的区别和选择
2020/02/26 Python
详解Scrapy Redis入门实战
2020/11/18 Python
python wsgiref源码解析
2021/02/06 Python
HTML5之SVG 2D入门12—SVG DOM及DOM操作介绍
2013/01/30 HTML / CSS
美国知名的百货清仓店:Neiman Marcus Last Call
2016/08/03 全球购物
State Cashmere官网:半零售价可持续蒙古羊绒
2020/02/26 全球购物
网上商城创业计划书范文
2014/01/31 职场文书
保证书范文大全
2014/04/28 职场文书
企业环保标语
2014/06/10 职场文书
学校运动会广播稿100条
2014/09/14 职场文书
催款函范本大全
2015/06/24 职场文书
2016年中秋祝酒词
2015/11/26 职场文书
SpringBoot中HttpSessionListener的简单使用方式
2022/03/17 Java/Android
如何设置多台电脑共享打印机?多台电脑共享打印机的方法
2022/04/08 数码科技
mysql如何查询连续记录
2022/05/11 MySQL