jQuery选择输入[type = image]兄弟姐妹

时间:2010-02-05 09:55:29

标签: jquery jquery-selectors

我正在尝试将这些表单转换为ajax (例子)

<table>
<tr>
            <td>Prov</td><td>Cod</td><td>Nombre</td><td>Precio</td><td>Stock1</td><td></td><td></td>
        </tr>

                <tr class="o d">
                    <td class="provName">Karabitian</td>

                    <td class="cod d">494011135</td>
                    <td class="name" id="artID13899">Eje del. m505  y4ch98040 comp. s/cierre Shimano</td>
                    <td class="alignright">$&nbsp;69.00</td>
                    <td class="center">-</td>
                    <td class="add">
                <nobr>

                    <form name="formularioAgregaItem" action="script.php" method="POST" autocomplete="off" class="add">
                        <fieldset>
                            <input name="function" value="cartAddByBarcode" type="hidden">
                            <input name="barcode" value="KAR005834" type="hidden">
                            <input name="orderID" value="23333" type="hidden">
                            <input name="qty" id="qty13899" size="2" maxlength="3" class="i" value="15" type="text">
                            <input src="add_16x16.gif" alt="agregar a la orden" type="image">
                        </fieldset>
                    </form>

                </nobr>
                </td>
                </tr>

                <tr class="o d">
                    <td class="provName">Karabitian</td>

                    <td class="cod d">494011137</td>
                    <td class="name" id="artID13900">Eje del. m565  y4c698010  comp. s/cierre Shimano</td>
                    <td class="alignright">$&nbsp;260.00</td>
                    <td class="center">-</td>
                    <td class="add">
                <nobr>

                    <form name="formularioAgregaItem" action="script.php" method="POST" autocomplete="off" class="add">
                        <fieldset>
                            <input name="function" value="cartAddByBarcode" type="hidden">
                            <input name="barcode" value="KAR005835" type="hidden">
                            <input name="orderID" value="23333" type="hidden">
                            <input name="qty" id="qty13900" size="2" maxlength="3" class="i" value="15" type="text">
                            <input src="add_16x16.gif" alt="agregar a la orden" type="image">
                        </fieldset>
                    </form>

                </nobr>
                </td>
                </tr>

                <tr class="o d">
                    <td class="provName">Karabitian</td>

                    <td class="cod d">494011143</td>
                    <td class="name" id="artID13905">Eje del. m775  y26k98030 comp. s/cierre Shimano</td>
                    <td class="alignright">$&nbsp;290.00</td>
                    <td class="center">-</td>
                    <td class="add">
                <nobr>

                    <form name="formularioAgregaItem" action="script.php" method="POST" autocomplete="off" class="add">
                        <fieldset>
                            <input name="function" value="cartAddByBarcode" type="hidden">
                            <input name="barcode" value="KAR005837" type="hidden">
                            <input name="orderID" value="23333" type="hidden">
                            <input name="qty" id="qty13905" size="2" maxlength="3" class="i" value="15" type="text">
                            <input src="add_16x16.gif" alt="agregar a la orden" type="image">
                        </fieldset>
                    </form>

                </nobr>
                </td>
                </tr>

                <tr class="o d">
                    <td class="provName">Karabitian</td>

                    <td class="cod d">494011153</td>
                    <td class="name" id="artID13910">Eje del. r500  y4bg98030  comp. s/cierre Shimano</td>
                    <td class="alignright">$&nbsp;73.00</td>
                    <td class="center">-</td>
                    <td class="add">
                <nobr>

                    <form name="formularioAgregaItem" action="script.php" method="POST" autocomplete="off" class="add">
                        <fieldset>
                            <input name="function" value="cartAddByBarcode" type="hidden">
                            <input name="barcode" value="KAR005841" type="hidden">
                            <input name="orderID" value="23333" type="hidden">
                            <input name="qty" id="qty13910" size="2" maxlength="3" class="i" value="15" type="text">
                            <input src="add_16x16.gif" alt="agregar a la orden" type="image">
                        </fieldset>
                    </form>

                </nobr>
                </td>
                </tr>

                <tr class="o d">
                    <td class="provName">Karabitian</td>

                    <td class="cod d">494011157</td>
                    <td class="name" id="artID13914">Eje del. r560  y4c498010 comp. s/cierre Shimano</td>
                    <td class="alignright">$&nbsp;137.00</td>
                    <td class="center">-</td>
                    <td class="add">
                <nobr>

                    <form name="formularioAgregaItem" action="script.php" method="POST" autocomplete="off" class="add">
                        <fieldset>
                            <input name="function" value="cartAddByBarcode" type="hidden">
                            <input name="barcode" value="KAR005845" type="hidden">
                            <input name="orderID" value="23333" type="hidden">
                            <input name="qty" id="qty13914" size="2" maxlength="3" class="i" value="15" type="text">
                            <input src="add_16x16.gif" alt="agregar a la orden" type="image">
                        </fieldset>
                    </form>

                </nobr>
                </td>
                </tr>
</table>

但我无法弄清楚如何从我点击的同一行获取输入

$('input[type=image]').click(function(){
    // insert voodoo go get inputs here
    // ajax call
    return false;
});

我不能做像$这样的事情(输入[name =“barcode”]) 有什么想法吗?

2 个答案:

答案 0 :(得分:12)

你需要这样做:

$('input[type=image]').click(function(){
    var image = $(this);
    var parent = image.parent(); // this will be the fieldset, could also do .closest('fieldset)', if the fieldset is not the immediate parent
    var neededInput = $('input[name=barcode]', parent);
    // do something with it
    return false;
});

或使用siblings() - 方法

$('input[type=image]').click(function (event){
    event.preventDefault();
    var $image = $(this);
    var $neededInput = $image.siblings('input[name=barcode]');
    // do something with it
});

答案 1 :(得分:1)

在点击功能中,this将是您点击图片的参考。所以你可以做到

$(this).siblings()

$(this).closest('fieldset').find(...);