Question

我的表中有一个单元格的onclick事件，然后我希望能够获得具有某个类名的单元格的值。

HTML：

<div class="table-responsive ManagementTableScroll">
    <table class="table table-bordered RoleTable" id="CreateEditRoleTable">
        <thead>
            <tr>
                <th>Permission Name</th>
                <th>Permission Type</th>
                <th>Permission Value</th>
                <th id="EditPermissionTableHead" style="display: table-cell;">Edit Permission</th>
                <th>Remove</th>
            </tr>
        </thead>
        <tbody id="PendingPermissionsTableBody">
            <tr>
                <td class="TdCenter EditPermissionName">Export Amount</td>
                <td class="TdCenter EditPermissionType">Whole number</td>
                <td class="TdCenter EditPermissionValue">5</td>
                <td class="TdCenter">
                    <a class="glyphicon glyphicon-pencil TdCenter" id="EditPermission" href="#">EditPermission</a>
                </td>
                <td class="TdCenter">
                    <a class="glyphicon glyphicon-remove TdCenter" id="RemoveRow" href="#"> RemoveRow </a>
                </td>
            </tr>
        </tbody>
    </table>
</div>

Jquery的：

$(document).on("click", "#EditPermission", function () {
    $('#CreateOptionDD').val("Previous");
    $('#CreateOptionDD').trigger('change');
    $(this).find('.EditPermissionName').val();
});

我原以为这$(this).find(classname)会找到价值。但它返回undefined。

Answer 1

在过滤掉树之前，您需要找到上面的表格（在HTML树上）。所以改变

search[value]

到

$(this).find('.EditPermissionName').text();

$(this).closest('tr').find('.EditPermissionName').text();应返回$(this).closest('tr')元素。然后，您需要在此（<tr>）

下找到.EditPermissionName

Answer 2

最好在每一行添加一个标识符，这样您就可以轻松获取和更新该行中的任何数据。

<div class="table-responsive ManagementTableScroll">
<table class="table table-bordered RoleTable" id="CreateEditRoleTable">
    <thead>
        <tr>
            <th>Permission Name</th>
            <th>Permission Type</th>
            <th>Permission Value</th>
            <th id="EditPermissionTableHead" style="display: table-cell;">Edit Permission</th>
            <th>Remove</th>
        </tr>
    </thead>
    <tbody id="PendingPermissionsTableBody">
        <tr id="unique-id-1"> 
            <input type="hidden" id="EditPermissionValue" value="5">
            <td class="TdCenter EditPermissionName">Export Amount</td>
            <td class="TdCenter EditPermissionType">Whole number</td> 
            <td class="TdCenter">5</td> 
            <td class="TdCenter"><a class="glyphicon glyphicon-pencil TdCenter" id="EditPermission" href="#"></a></td> 
            <td class="TdCenter"><a class="glyphicon glyphicon-remove TdCenter" id="RemoveRow" href="#"></a></td> 
        </tr>
        <tr id="unique-id-2"> 
            <input type="hidden" id="EditPermissionValue" value="5">
            <td class="TdCenter EditPermissionName">Export Amount</td>
            <td class="TdCenter EditPermissionType">Whole number</td> 
            <td class="TdCenter">5</td> 
            <td class="TdCenter"><a class="glyphicon glyphicon-pencil TdCenter" id="EditPermission" href="#"></a></td> 
            <td class="TdCenter"><a class="glyphicon glyphicon-remove TdCenter" id="RemoveRow" href="#"></a></td> 
        </tr>
    </tbody>
</table>

你可以创建一个隐藏的输入并在那里设置EditPermissionValue值，你可以像这样通过jquery获取值。

 $(document).on("click", "#EditPermission", function () {
     var $row = $(this).closest("tr");

    $permission_value = $row.find('#EditPermissionValue').val();

    $('#CreateOptionDD').trigger('change');
});

如何根据同一行上的单元格点击查找表格单元格值？

2 个答案: