javascript - jquery - 获取 html 表中 <tr> 的值

Question

我有一个 AJAX 创建的表。

我需要对通过ajax创建的那些表调用ajax请求。

通过this我想出了在动态创建的 HTML 元素上调用 click 函数。

表格看起来像这样。

<table>
    <thead>
        <th>Sr. No</th>
        <th>Label</th>
    </thead>
    <tbody>
        <tr value="1">
            <td>1.</td>
            <td>One</td>
        </tr>
        <tr value="2">
            <td>2.</td>
            <td>Two</td>
        </tr>
    </tbody>
</table>

我已为 tr 赋值，现在我想在单击 tr 时创建另一个 ajax 请求。并根据该值运行查询来获取数据。

我面临的挑战是我无法获取 tr 的值。

这是我尝试过的代码。

$(document).ready(function() {
    $('.table').on('click', 'table tbody tr', function() {
        alert($(this).val())
    })
})

这是fiddle .

即使在 fiddle 中我也无法获取 tr 的值。

请帮我找出哪里出错了。

提前致谢。

Answer 1

您可以使用.attr() 相反:

$(document).ready(function() {
    $('.table').on('click', 'table tbody tr', function() {
        alert($(this).attr('value'))
    })
})

<强> Updated Fiddle

但实际上你应该使用 data-* HTML5 属性:

<tr data-value="1">

然后使用.data()检索它:

$(document).ready(function() {
    $('.table').on('click', 'table tbody tr', function() {
        alert($(this).data('value'))
    })
})  

<强> Updated Fiddle