javascript - 使用 .closest 从 td 获取值并没有给出值

Question

我像这样创建表格:

<table class="table" id="tbl_items">
<thead>
    <tr>
        <th>
            Id
        </th>
        <th>
            Item
        </th>
        <th>
            Serial Key
        </th>
        <th>
            Brand
        </th>
        <th>
            Quantity
        </th>
        <th>
            Description
        </th>
        <th>Action</th>
    </tr>
</thead>
<tbody>
    @foreach (var item in Model)
    {
        ViewBag.AccountID = item.AccountId.ToString();
        if (item.Items != null)
        {
            foreach (var itemOnList in item.Items)
            {
                <tr>
                    <td class="cls-itemid" data-itemid="@itemOnList.ItemId">@Html.DisplayFor(model => itemOnList.ItemId)</td>
                    <td class="cls-itemname" data-itemname="@itemOnList.ItemName">@Html.EditorFor(model => itemOnList.ItemName)</td>
                    <td class="cls-serialnumber" data-serialnumber="@itemOnList.SerialNumber">@Html.EditorFor(model => itemOnList.SerialNumber)</td>
                    <td class="cls-brandname" data-brandname="@itemOnList.BrandName">@Html.EditorFor(model => itemOnList.BrandName)</td>
                    <td class="cls-quantity" data-quantity="@itemOnList.Quantity">@Html.EditorFor(model => itemOnList.Quantity)</td>
                    <td class="cls-description" data-description="@itemOnList.Description">@Html.EditorFor(model => itemOnList.Description)</td>
                    <td>
                        <a href="javascript:void(0);" data-itemid="@itemOnList.ItemId" class="btn_edit">Edit |</a>
                        <a href="javascript:void(0);" data-itemid="@itemOnList.ItemId" class="btn_delete">Delete</a>
                    </td>
                </tr>
            }
        }
    }
</tbody>

我正在尝试使用以下方法连续获取 td 的值:

$(".btn_edit").click(function() {
    var row = $(this).closest("tr");
    var text = row.find(".cls-itemname").text();
    alert(text);
});

警告框没有任何值(value)。我无法使用数据项，因为当我更改 @Html.EditorFor 框的值时，它会给出旧值而不是新值。

Answer 1

自从您使用 @Html.DisplayFor() 返回 <input>元素...我猜你想要输入的文本...

这会起作用:

$(".btn_edit").click(function() {
  var row = $(this).closest("tr");
  var text = row.find(".cls-itemname input").val();  // <-- Look the change here
  alert(text);
});

.cls-itemname 中根本没有任何文字。元素...但是有一个 input有一个 value 。使用 .val() 反对input .