jquery - 获取html表中的值

时间:2014-04-30 09:24:31

标签: javascript jquery html ajax

我有一个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

即使在小提琴中,我也无法获得tr的价值。

请帮我找出我出错的地方。

提前致谢。

4 个答案:

答案 0 :(得分:4)

您可以改为使用 .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

答案 1 :(得分:0)

尝试使用.attr()

alert($(this).attr("value"));

答案 2 :(得分:0)

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

请参阅http://jsfiddle.net/tqQm5/4/

答案 3 :(得分:0)

使用val()属性的tr instated的text()属性。

请参阅此Fiddle

请参阅此代码

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