Question

我有一个从Td元素中获取正确值的问题。当我点击该元素但没有其他行正在工作时，我可以获得表格中的第一个元素。我的代码看起来像这样：

<div id="Users">
                    <table id="UserTable" class="table table-striped table-bordered" width="100%" cellspacing="0">
                        <thead>
                            <tr>
                                <th name="id">ID</th>
                                <th name="UserName">Användarnamn</th>
                                <th>Installation</th>
                                <th>Säljföretag</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach (var users in Model.AdminUsers)
                            {
                                <tr>
                                    <td id="userId">@users.Id</td>
                                    <td id="userName" >
                                        <a id="userIds"href="#backdropreport" class="">@users.UserName </a>
                                    </td>
                                    <td>@users.InstallationId</td>
                                    <td>@users.MerchantId</td>
                                </tr>

                            }
                        </tbody>
                    </table>
                </div>

我的Jquery代码：

            $("#userName").click(function () {
               var id = $("#userId").text();
               $("#user").val(id);
        });

模型内容对话框

<div id="backdropreport">
<div class="modal-content">
    <div class="header">
        <h3>Återställ lösenord</h3>
    </div>
    @using (Html.BeginForm("ResetPassword", "Users", FormMethod.Post)) 
    {
        <div class="copy">
            <div class="form-group">
                <div class="m-form-item">
                    För att återställa lösenordet så tryck på återställ så kommer ett mail skickas med ett nytt lösenord 
                </div>
                <div style="clear: both;">
                    &nbsp;
                </div>
                <div class="m-form-item">
                    <input type="submit" id="reset" value="Återställ" class="btn btn-primary" />
                    <a id="close" href="#" class="btn btn-grey">Stäng</a>
                </div>
                    <div class="m-form-item">
                    </div>
                </div>

            <input type="text" id="user" name="user"  />

        </div>
    }
</div>
<a href="#"><div class="overlay"></div></a>

我想要做的是在用户点击用户名时获取特定td元素的id。目前，表中的第一个元素正在运行。有什么建议吗？

Answer 1

id在整个DOM文档中应该是唯一的。您可以改用类，并使用.class选择器。

@foreach (var users in Model.AdminUsers) {
  <tr>
    <td class="userId">@users.Id</td>
    <td class="userName">
      <a class="userIds" href="#backdropreport">@users.UserName</a>
    </td>
    <td>@users.InstallationId</td>
    <td>@users.MerchantId</td>
  </tr>
}

$(".userName").click(function() {
  var userId = $(this).siblings(".userId").text();
  alert(userId);
});

Answer 2

Html属性“id”应该是唯一的，但是当你进行foreach循环时，那么在所有行中＆lt; td＆gt; element有id =“userId”。我建议你将userId添加到html id属性：

<tbody>
    @foreach (var users in Model.AdminUsers)
    {
        <tr>
            <td id="userId_@users.Id">@users.Id</td>
            <td id="userName_@users.Id" >
                <a id="userIds"href="#backdropreport" class="">@users.UserName </a>
            </td>
            <td>@users.InstallationId</td>
            <td>@users.MerchantId</td>
        </tr>

    }
</tbody>

单击td行时获取td值。 MVC

2 个答案: