问题一:当咱们在表格中会有以下点击按钮,而后获取该行的某列信息;
在 批改按钮 上设置 οnclick=”edit(this)”
function edit(val){
// 这里就是 val,别以为写错了,如果写成 this 会报错:Uncaught SyntaxError: Unexpected token 'this',这是转过来的参数值的意思
var value = $(val).parent().parent().find("td");
console.log(value.eq(1).text()); //15900012520 失去第二列的数据
}
问题二:当咱们抉择 checkbox 的单选或多选框,获取该行的某列数据
比方你要获取选中的这行的 IMEI 号:
// 获取选中那列的数据
var checkLength = $("input:checkbox[name='checksId']:checked").length;
//if(checkLength == 0) {// alert("请至多勾选中一项须要删除的内容!");
// return;
// }
$("input[type='checkbox']").each(function(){ // 遍历 checkbox 的抉择状态
if($(this).prop("checked")){ // 如果值为 checked 表明选中了
// console.log("选中该行的 IEMI:"+$(this).closest('tr').find('td').eq(7).text());
var delei = $(this).closest('tr').find('td').eq(7).text();// 获取 eq 为 7 的那一列数据(就是第 7 列)console.log("选中改行的列值:"+typeof delei+delei);
}
});
问题三:鼠标移到哪一行,就显示哪一行的某列内容;
略!没做过,可集体思路是:相似下面,先定义鼠标移到该行的操作,如:hover,而后才定义一个获取办法(后面用的的是 onclick);
总结:获取每行的某列数据,列出罕用几条(用 JS 或者 JQ 都没有区别 ):
(1)var value = $(this1).parent().parent().find(“td”).eq(1).text();// 取得该行的第二列数据
(2)var value = $(this).closest(‘tr’).find(‘td’).eq(7).text();// 获取 eq 为 7 的那一列数据(就是第 7 列)
(3)var value = $(this).children().eq(1).text();// 所点击的一行的第二个 td 内容
(4)var value = $(this).find(“td”).eq(1).html();
最初.text() 和.html() 取得文本信息和页面信息,记得本人要取得的是什么?能够尝试下,
parent 和 closest 和 children 这个别离是父元素和先人元素和子元素,find 是查找他们的父元素的意思
能够取一反三!
扩大简略阐明:
VUE 实现就更简略咯!首先 VUE 须要绑定 @selection-change=”handleSelectionChange”,就是要获取表格行的内容
handleSelectionChange(selection) {
this.checkedList = selection;
this.$emit("selection-change", this.checkedList);
},
你在点击按钮事件,加上 ROW 该行内容,也就是你点击哪行就获取哪行的内容,如:editClick(row) {}
把获取的内容保存起来,如果弹出的 diglog 窗口,那就把这些值传过来;(父子类互相传值的 VUE 办法:prop、emit,百度一下)