Question

我的表行看起来像 enter image description here

HTML看起来像 enter image description here

当用户更改Name字段的值时，我将“select”传递给nameDropChanged函数。获得参考选择后我想更改优惠券数量值选择框。如何使用Jquery获取对它的引用？表中还会有许多这样的确切行。

更新：这是虚拟HTML代码和jsfiddle link

    <table id="competitors_table" width="100%" style="border-bottom: #000000 solid 1px;">
<tbody>
    <tr>
        <td>Name:<select name="CompetitorIDs_Setting_[]" onchange="nameDropDownChanged(this);">
            <option value="0">N/A</option><optgroup label="Similar Stores"></optgroup>
            <optgroup label="Other Stores">
            <option value="1">flipkart</option>
            <option value="2">bigshoebazaar</option>
            <option value="160">presto</option>
            <option value="3">fabindia</option>
            <option value="4">fashnvia</option>
        </td>
        <td>
            <select name="Position_Setting_[]" onchange="dropDownChanged(this);">
                <option value="1000">Top</option>
                <option value="1001">Middle</option>
                <option value="1002">Bottom</option>                                                    
                <option value="">Enter Position</option>
            </select>
            <input type="text" name="PositionNumber_Setting_[]" size="3" style="display: none;">
        </td>
        <td>Number of Coupons:<select id="numberOfCoupons_Setting_[]"></select></td>
    </tr>
</tbody>
</table>

Javascript代码

  function nameDropDownChanged(select)
{
    var selectedIndex = select.selectedIndex;   
    var WebsiteName = select.options[selectedIndex].innerHTML;
    var couponCount = <?php if(!empty($couponCount)){ echo json_encode($couponCount); }?>;

    if(Object.keys(couponCount).length > 0)
    {
        var numberOfCoupons = couponCount[WebsiteName];
        var numberOfCouponsDropDown = document.getElementById('numberOfCouponsSelect');
        $("#numberOfCouponsSelect").empty();
        if(numberOfCoupons > 0)
        {
            for(var i=1; i <= numberOfCoupons; i++)
            {
                var option = document.createElement('option');
                option.value = i;
                option.innerHTML = i;
                numberOfCouponsDropDown.appendChild(option);
            }
        }
        else
        {
            var option = document.createElement('option');
            option.value=1;
            option.innerHTML = "No Active Coupons";
            numberOfCouponsDropDown.appendChild(option);
        }
    }
}

Answer 1

在nameDropChanged函数中..

// considering 'parameter' is the variable to be passed as a parameter to nameDropChanged function
$numberSelect = $(parameter).parent().nextAll(':last').children('select');
// $numberSelect is now containing a reference to the numberOfCoupons_Setting_[ select]

Answer 2

你可以做这样的事情

$('#Selector_ID1, #Selector_ID2, #Selector_ID3, ...').change(function() {
    var parent = $(this).parents("tr");
    var elm = $("td:last-child", parent).children("select");
    //Do your operation with last Select Element here.
});

这有两个方面的帮助

你不需要知道确切的父母和孩子，而只是反过来跟踪父级，在第一种情况下是TR，然后是最后一次SELECT 父母。
只需一次就可以处理多行。您可以也可以在这里使用类选择器。

jquery：获取表行内的select

2 个答案: