0

我有一个这样的html表:

| name | type   | edit |
| zzz  | aaaa   | edit |
| xxx  | bbbb   | edit |
| mmm  | cccc   | edit |

所以,我想做的是,如果我对第二行按下编辑,我希望将数据“xxx”和“bbb”存储在一些 javascript 变量中以供进一步使用

我找到了这段代码。但它只会给我点击的单元格而不是整行

$('#tableID').click(function(e){
    alert($(e.target).text()); // using jQuery
})

更新: 这是我的表格单元格结构

<tr>
        <td> <?php echo $row['name'] ?> </td>
        <td> <?php echo $row['type'] ?></td>
        <td class="edit_button">Edit</td> 
</tr>

这是我用来对付它的 JS

$("#table_id").on("click", ".edit_button", function() {
                    var data = $(this).closest("td").siblings().map(function() {
                    return $(this).text();
                }).toArray();
            }); 
            alert(data[0]);
            alert(data[1]);
            alert(data[2]);
}
4

2 回答 2

2
$tr=$(e.target).closest("tr");

这会将表格行存储在变量中。

然后,您可以使用以下命令访问每个 td 单元:

$tr.find('td').each(function(){alert($(this).text())});

这是一个示例:http: //jsfiddle.net/snowburnt/N85uA/

于 2013-10-28T17:42:04.443 回答
1

我会使用事件委托而不是e.target. 只需给你的编辑按钮一个类。

$("tableID").on("click", ".edit_button", function() {
    var data = $(this).closest("td").siblings().map(function() {
        return $(this).text();
    }).toArray();

    console.log(data);
});

现在data将保存带有edit按钮的单元格的兄弟姐妹数组。


如果您不需要数组,但想直接在循环中处理文本,我会这样做。

$("tableID").on("click", ".edit_button", function() {
    $(this).closest("td").siblings().text(function(i, txt) {
        console.log(txt); // do something with the text
    });
});
于 2013-10-28T17:46:45.103 回答