javascript - 使用 jquery 查找与可点击元素同一行的文本框的值

Question

我有一个 HTML 表格。在每一行中，我都有一个“添加”按钮以及一个数量输入框、型号、型号描述和价格。单击该按钮时，我有一个 onclick 事件，该事件会触发我们的分析跟踪功能。

单击添加按钮时，我需要从单击“添加”按钮的同一行的文本框中获取数量。目前，返回的唯一元素是表的第一行。我尝试了几种使用 .click、.live 和 .on 以及 .closest 的方法。

这是代码，我希望有人可以帮助我，因为我在尝试获取这个值时迷失了。

HTML

<table id="ElementCount10">
    <thead>
        <tbody>
            <tr class="odd">
                <td class="image">
                    <div class="modelphoto link"><a rel="#"><img class="modelthumb" alt="" src="image.jpg"></a></div>
                </td>
                <td class="model sorting_1">
                    <a class="sku" href="#">Sample Part</a>
                </td>
                <td class="descript" rowspan="1" colspan="1">Part Description</td>
                <td class="avail"><span class="instock">In Stock</span></td>
                <td class="price">$318.00</td>
                <td class="cart">
                    <input type="hidden" name="labelid" value="1234567">
                    <input type="hidden" name="productid" value="Part Number">
                    <input class="qty" type="text" name="quantity" value="" size="2" maxlength="3">
                    <a class="btn-primary" href="#" onclick="SiteCatalystSingleTracking('SingleAddToCart',1,this,event.target.nodeName);return false;">
                </td>
            </tr>
            <tr class="even">
                <td class="image">
                    <div class="modelphoto link"><a rel="#"><img class="modelthumb" alt="" src="image.jpg"></a></div>
               </td>
               <td class="model sorting_1"><a class="sku" href="#">Part Number</a></td>
               <td class="descript" rowspan="1" colspan="1">Part Description</td>
               <td class="avail"><span class="instock">In Stock</span></td>
               <td class="price">$371.00</td>
               <td class="cart">
                   <input type="hidden" name="labelid" value="1234567">
                   <input type="hidden" name="productid" value="Part Number">
                   <input class="qty" type="text" name="quantity" value="" size="2" maxlength="3">
                   <a class="btn-primary" href="#" onclick="SiteCatalystSingleTracking('SingleAddToCart',1,this,event.target.nodeName);return false;">
               </td>
          </tr>

JS

function SiteCatalystSingleTracking(carttype, requiredamt, $this, thisTarget) { // $this is the actual table to process
    var parts = '';
    var node = "";
    var parent_path = '';
    alert("T:" + thisTarget);
    thisNewTarget = $(thisTarget).parents("td.cart").children("input[name=quantity]").val();
    alert("NT: " + thisNewTarget);
    parent_path = $($this).parents("table").attr("id");
    var sku = $("#" + parent_path + " tbody tr .cart").children("input[name=productid]").val();
    var qty = $("#" + parent_path + " tbody tr .cart").children("input[name=quantity]").val();
    var labelid = $("#" + parent_path + " tbody tr .cart").children("input[name=labelid]").val();
 }

我真的需要一些帮助。任何事情都会很棒!

-希瑟熊

Answer 1

$($this).closest("tr").find("input[name=quantity]").val();

尽管当参数不是 jquery 对象而是 DOM 元素时，您确实不应该将其命名为 $this。这真的很令人困惑。