javascript - 从表行中的隐藏输入字段获取值

Question

我有一个表，它是使用数据库中的数据自动生成并使用 jquery 创建的。这是使用附加到主 tbody 的以下 tr 变量创建的:下面是我的代码:

var list = " <tr id='order_no_tr'><td id='order_no_td" + item.documentno + "'>" + item.documentno + "</td><td>" + item.progressstatus + "</td><td>" + newDate + "</td>\n\
                                <td><button type='button' id='cnfrmd_rcvd" + item.c_order_id + "' class='btn btn-default btn-sm cnfrmd_rcvd" + item.c_order_id + "' >Confirm Received</button>\n\
        <input type='hidden' name='order_no_txt' id='order_no_txt" + item.c_order_id + "' value='" + item.c_order_id + "' class='order_no_txt" + item.c_order_id + " btn btn-primary'/>\n\
        </td></tr>";
$("#order_no_tbody").append(list);
$("#order_no_tr").on("click", ".cnfrmd_rcvd" + item.c_order_id, function() {
    var order_no = this.value;
    alert(order_no);
});

现在我想获取名为 order_no_txt 的 html 输入名称的值，我尝试通过以下函数访问它，但失败了:

$("#order_no_tr").on("click", ".cnfrmd_rcvd" + item.c_order_id, function() {
    var order_no = this.value;
    alert(order_no);
});

请告诉我如何实现这一目标？

Answer 1

由于隐藏元素是按钮的同级元素，因此您可以使用 .next() 来利用关系遍历元素。并使用 .val() 获取其值方法。

$("#order_no_tr").on("click", ".cnfrmd_rcvd" + item.c_order_id, function() {
    var a = $(this).next(':hidden').val();
            //Following can also be used
            //$(this).closest('td').find(':hidden').val()
    alert(a);
});

引用文献

• :hidden Selector

你应该学习event delegation ，用于动态创建的元素。

<小时/>

根据评论点击仅适用于第一条记录，而对其他记录则失败。，标识符必须是唯一的。看来您正在重用order_no_tr 作为 ID 多次，因此这是预期的行为。

改变

$("#order_no_tr").on("click", ".cnfrmd_rcvd" + item.c_order_id, function() {
});

至

$(".cnfrmd_rcvd" + item.c_order_id).on("click", function() {
});