javascript - 获取 tablerow 中的按钮 rowIndex

Question

我尝试获取表中按钮的 rowIndex？没有什么对我有用:

let tr = $('<tr class="tableRow"></tr>');
let td = $('<td class="noWrap"></td>');

let btn = $('<button type="button" class="btn btnEdit"></button>');
td.html(btn);

tr.html(td);
$('#table1 > tbody:last-child').append(tr);

$('.btnEditMenge').on('click', ()=>{
    $(function(){
        let rowindex = $(this).clostest('tr').rowIndex     // undefined
        let c = $(this).closest('.tableRow');              // Array[0]
        let b = $(this).parent();                          // Array[0]
    });
});

onClick 监听器中的注释是，当我单击按钮时。

Answer 1

对代码进行一些重构:

let tr = $('<tr class="tableRow"></tr>');
let td = $('<td class="noWrap"></td>');
let btn = $('<button type="button" class="btn btnEdit"></button>');

btn.appendTo(td);
td.appendTo(tr);
tr.appendTo($('#table1 > tbody:last-child'));

// Or: 
// btn.appendTo(td.appendTo(tr.appendTo($('#table1 > tbody:last-child'))));

$('.btnEditMenge').on('click', function() {
    let $btn = $(this);
    let rowindex = $btn.closest('tr').index();
    let $tableRow = $btn.closest('.tableRow');
    let $parent = $btn.parent(); 
});

1. 使用appendTo() (或 append() 、 before() 等...)而不是 html()附加 DOM 元素；
2. 使用index()获取任意元素的索引；
3. 不要对事件使用箭头函数，this could not be what you're expecting ;
4. $(function() { })不是用于此目的，它用于绑定(bind) document.ready 事件中的事件。它不应该在另一个事件中使用；
5. 尝试为变量提供函数名称。避免使用诸如 b 或 c 之类的名称。