js获取table中事件触发行的内容

稻园

已于 2024-02-23 13:44:02 修改

阅读量400

点赞数 5

文章标签： javascript 前端 java

于 2024-02-23 13:41:06 首次发布

本文链接：https://blog.csdn.net/loody1/article/details/136253531

版权

本文介绍了如何在HTML表格中使用JavaScript和jQuery来处理td元素的点击事件，通过`js函数名`获取输入元素所在行及列的其他td元素的文本内容。

摘要由CSDN通过智能技术生成

当触发table中的某个格子（含格子内元素）的事件，获取格子所在行的其他格子的内容

1.在<td>标签中加入一个<input>，在<input>中添加：事件名="js函数名(this)"，把此<td>传递给js，如：

<table>
    <tbody>
        <td><input 事件名="js函数名(this)" /></td>
        多个<td>
    </tbody>
</table>

如果不添加<input>，可参考序号2中第2行的内容，减少parent()的使用

2.触发<input>标签中的事件，在<script>标签中定义对应的函数，获取所需内容（其中m和n都是从0开始）：

function js函数名(val) {

    var value=$(val).parent().parent().find("td");  //其中val是<input>，第一个parent()获取包含val的<td>的object，第二个获取包含这个<td>的<tr>，find("td")把<tr>object转换为<td>数组

    参数=value.eq(n).text();  //获取第n个<td>中的文本

    参数=value.eq(n).find("input")[m].value;  //获取第n个<td>中第m个<input>中的文本

}