想要在单击 table 行时获取当前表格数据的值

Want to get the value of current tabe data on click of table row

我有一个 table,其中有多行,每行都有 table 数据。现在我想获取 table 当前 tr.

点击数据的数据 link 属性

我的table结构如下:

<tr id="row1jqxgrid" role="row" data-key="1">
<td class="jqx-cell jqx-cell-darkblue jqx-grid-cell jqx-grid-       cell-darkblue jqx-item jqx-item-darkblue jqx-grid-      cell-nowrap jqx-grid-cell-nowrap-darkblue" style="max-width:350px; width:350px;border-left-width: 0px;" role="gridcell">
<span class=""></span>
 <span class="jqx-tree-grid-title jqx-tree-grid-title-darkblue jqx-grid-cell-wrap jqx-grid-cell-wrap-darkblue">Accenture222</span></td>
    <a class="ClickClass" data-link="http://www.recruiterfeedback.com/trs/index.php/recruiter/feedback_details/174">
        <button class="btn btn-primary btn-sm ClickClass">
            <i class="fa fa-search"></i> View
        </button>
    </a>
    </td>
</tr>

我已经尝试用 jquery 得到它,但没有成功:

$("#jqxgrid").on('rowSelect', function() {
    var current = $('#jqxgrid').attr('data-link');

    alert(current);

    var args = event.args;

    var rowData = args.row;
    //  var a_href = $(this).find(rowData);
    // alert(a_href); 
    var rowKey = args.key;

    console.log(args);
    console.log(rowKey);
    console.log(event);
});
$("tr").click(function() {
    var link = $("#"+$(this).attr('id')+" .ClickClass").attr('data-link');
    alert(link);
);

顺便说一下,你在 Accenture222

之后还有一个额外的关闭 </td>

JSFiddle

属性 data-link 是 table 内锚元素的一部分。因此,您需要首先使用 .find().chilren() 定位该锚点,然后获取其数据属性。

$("#jqxgrid").on('click', function() {
        var current = $(this).find('a.ClickClass').data("link");
        alert(current);
    });

工作示例:https://jsfiddle.net/DinoMyte/1jgo6mpc/3/

<!doctype html>
<html>
    <head>
        <meta content="text/html; charset=UTF-8" http-equiv="Content-Type" />
        <script src="https://code.jquery.com/jquery-2.2.0.js"></script>
        <script>
            $(document).ready(function () {

                $("#jqxgrid tr").click(function () {
                    var link = $(this).find("td").eq(1).find("a").data("link");
                    alert(link);
                });
            });
        </script>
    </head>

    <body>
        <table id="jqxgrid">
            <tr id="row1jqxgrid" role="row" data-key="1">
                <td class="jqx-cell jqx-cell-darkblue jqx-grid-cell jqx-grid-cell-darkblue jqx-item jqx-item-darkblue jqx-grid-      cell-nowrap jqx-grid-cell-nowrap-darkblue" style="max-width:350px; width:350px;border-left-width: 0px;" role="gridcell">
                    <span class=""></span>
                    <span class="jqx-tree-grid-title jqx-tree-grid-title-darkblue jqx-grid-cell-wrap jqx-grid-cell-wrap-darkblue">Accenture222</span>
                </td><td>
                    <a class="ClickClass" data-link="http://www.recruiterfeedback.com/trs/index.php/recruiter/feedback_details/174">
                        <button class="btn btn-primary btn-sm ClickClass">
                            <i class="fa fa-search"></i>
                            View
                        </button>
                    </a>
                </td>
            </tr>
        </table>
    </body>
</html>