Question

我一直在尝试在下一个td更新输入值，但没有成功..

此代码由“新项目”按钮创建，该按钮触发javascript：

<tr class="item1"><!-- contenido de tabla -->
    <td>
        <select name="postArrayProducto[]">
        <option>Suave</option>
            <option>Fuerte</option>
        <option>Merken</option>
        </select>
    </td>
    <td>
        <select name="postArrayFormato[]" onchange="cambiarUnidades(this.value)">
             <option value="frascoG">Frasco 370g</option>
         <option value="frascoC">Frasco 220g</option>
         <option value="sachet">Sachet 200g</option>
         <option value="doypack">Doy/Pack 250g</option>
        </select>
    </td>
    <td>
        <input type="text" name="postArrayUnidades[]" size="1" maxlength="3" readonly value="20"> unidades
    </td>
    <td>
        <input type="text" name="postArrayCajas[]" size="1" maxlength="3"> cajas
    </td>
</tr><!-- fin contenido tabla -->

所以当cambiarUnidades(this.value)被触发时，我想更改postArrayUnidades[]

JS：

<script type="text/javascript">
    $(window).load(function(){
        cambiarUnidades = function(el) {
            if(el == "frascoG"){
                $(el).parents('td').next('td').find('input').val('99');         
            }
            if(el == "frascoC"){
                $(el).parent('tr').find('td:nth-child(3)').find('input').val('99');             
            }
            if(el == "sachet"){
                $(el).parent('tr').find('td:nth-child(3)').find('input').value='99';  
            }
            if(el == "doypack"){
                $(el).parent().next('td').find('input').val('99'); 
            }      
        }
    });
</script>

我已尝试过所有这些并且无法正常工作，我无法更改输入值:(请帮忙！

Answer 1

<强>小提琴：

http://jsfiddle.net/gM2vX/2/

<强> HTML：

<table>
    <tr class="item1"><!-- contenido de tabla -->
        <td>
            <select name="postArrayProducto[]">
                <option>Suave</option>
                <option>Fuerte</option>
                <option>Merken</option>
            </select>
        </td>
        <td>
            <select name="postArrayFormato[]" id="test">
                <option value="frascoG">Frasco 370g</option>
                <option value="frascoC">Frasco 220g</option>
                <option value="sachet">Sachet 200g</option>
                <option value="doypack">Doy/Pack 250g</option>
            </select>
        </td>
        <td>
            <input type="text" name="postArrayUnidades[]" size="1" maxlength="3" readonly value="20"/> unidades
        </td>
        <td>
            <input type="text" name="postArrayCajas[]" size="1" maxlength="3"> cajas
        </td>
    </tr>
</table><!-- fin contenido tabla -->

<强> jquery的：

$(function(){
    $("body").on("change","#test",function(){
        $(this).parent().next().find("input").val("99");
   });

}）;

而不是body，你可以有一些不通过ajax动态加载的div。它提高了性能。它不会从文档级别搜索元素，而是从指定的元素（我所做的）（正文）

进行检查

Answer 2

你传递函数select的值（ onchange =“cambiarUnidades（this.value）”），这样你就不能使用像$（el）.parents（'td'这样的东西了。）....因为 el 是值，而不是对象。

首先你应该将onchange更改为 cambiarUnidades（this）

然后你必须在if语句中使用 $（el）.val（）== ... 。

接下来就是 parent（'tr'）不正确，因为parent（）不会上升2级，所以你应该使用 parents（'tr'）< / em>的

所以一行看起来像这样：

if ($(el).val() == "frascoC") { $(el).parents('tr').find('td:nth-child(3)').find('input').val('99'); }

还有一件事是你应该将TR元素包装在一个TABLE中以使其工作。

（显然还有其他解决方案，我试图指出代码的错误部分，而不是编写另一个解决方案）

无法在选择更改时更改输入值

2 个答案: