CNode

请教一个js的问题。获取表格点击所在的行

问答
Mmaxushuang发布于10 年前最后回复10 年前9 回复9467 浏览0 收藏
var tab=document.querySelector("table");
tab.addEventListener("click",function(e){
	var event=e || window.event;                              //	获取事件
	var srcEvent=event.srcElement || event.target;   //     获取事件目标
	///求教
});	
请问,如何获得点击的button  是哪一行的?谢谢。
查看回复

回复 (9)

C
captainblue2013#2·10 年前

不是不可以,只是觉得你这个操作有点怪,你不妨说说你的 最终目的是什么

E
Eamonnzhang#3·10 年前

判断当前的tr是第几个孩子节点吧

来自酷炫的 CNodeMD

M
maxushuang#4·10 年前
引用 captainblue2013不是不可以,只是觉得你这个操作有点怪,你不妨说说你的 最终目的是什么

@captainblue2013 最终目的是,监听表格里每行的button,然后进行事件处理

G
gzhangzy#5·10 年前
function(e){
	var event=e || window.event;                              //	获取事件
	var srcEvent=event.srcElement || event.target;   //     获取事件目标
	///求教
}

改成这样:

function listener(line) {
    return function(e){
	    var event=e || window.event;                              //	获取事件
	    var srcEvent=event.srcElement || event.target;   //     获取事件目标
	    ///求教
    };
}

在第一行加 listener(1),第二行加listener(2) ...

W
William17#6·10 年前

自定义属性

M
magicdawn#7·10 年前

如果你点的是 button, 那么 srcElement 回是这个 button

// 非button点击
if(srcElement.nodeName !== 'BUTTON') return;

var tr = srcElement.parentNode;
while(tr.nodeName !== 'TR') tr = srcElement.parentNode;

// 第几行
var table = this;
var index = table.children.indexOf(tr);
M
magicdawn#8·10 年前

其实我不太懂为什么都在去 jQuery

$('table').on('click', 'button', function(){
  var $tr = $(this).closest('tr');
  var index = $tr.index();
});
  1. 时间委托, 省去了你手动判断target 是不是想要的
  2. closest / index 等方法很好用
K
klausgao#9·10 年前

lz真心是入门级的。记住,表现层的东西永远应该有一个业务实体。所以无论你用jquery还是别的,都要有一个array相对应。好吧说了那么多,用vue吧,你要做的只要监控好实体,别的事情vue就自动帮你搞定了。

参与回复
登录后即可参与回复。登录