无法使用jQuery检索动态表TD值

Question

我试图在按钮时从动态创建的表中获取TD值这是我的桌子：

<tbody>
@foreach (var item in Model)
{
    <tr>
        <td id="Quantity">
            @Html.DisplayFor(modelItem => item.Quantity)
        </td>
       <td>
            <button type="button" class="btn btn-sm btn-info btnupdate" onclick="Update(@item.Id);">
               Update
            </button>
        </td>                            
    </tr>
}</tbody>

这是我的jQuery：

            function update(id) {
            var Id = id;
            var quantity = $(Quantity).html().trim();//get only first td value for every tr
            var quantity = $(Quantity).text().trim();//get every td value 
            var quantity = $(this).closest("tr").find("#Quantity").text().trim(); //undefined
            var quantity = $('#Quantity').attr("value") //undefined

        }

我无法弄清楚这个问题。任何形式的帮助将不胜感激。

Answer 1

您的 id到每个 td应该是唯一的，只需附加item.Id： -

即可实现

<td id="@("quantity" + item.Id)"> 

，然后您可以像已经在做的那样访问它，

function update(id) {
    var quantity = $('#quantity' + id).html().trim();
    alert(quantity);
}

Answer 2

您可以直接通过item.Quantity，可以接受为参数。

<button onclick="Update(@item.Id,@item.Quantity);">.....</button>

---

但是，我建议您使用.on(eventType, handler)方法使用不引人注目的事件处理程序。将@item.Id分配给可以使用.data(key)的自定义data-*属性。

然后可以使用各种DOM遍历方法

    <tr>
        <td class="Quantity">
            @Html.DisplayFor(modelItem => item.Quantity)
        </td>
       <td>
            <button type="button" class="btn btn-sm btn-info btnupdate" data-id="@item.Id" >
               Update
            </button>
        </td>                            
    </tr>

脚本

$('.btnupdate').on('click', function(){
    var id = $(this).data('id');
    var qty = $(this).closest('tr').find('Quantity').text();
});