用 jquery 为下一项赋值

Posted 2023-02-25

【中文标题】用 jquery 为下一项赋值

【英文标题】：put a value to the next item with jquery

【发布时间】：2010-12-22 18:06:48

【问题描述】：

我是 jquery 的新手。 我正在更改输入文本的值，我需要更改下一个输入文本的值，所以我的代码是：

$(document).ready(function()    

$('[type=text]').change(function() 

        $(this).next('input').val("newvalue");
    );

);

但是什么都没有……！

---

编辑：从下面的评论中发布 html

<form method="post" action="/volume/create"> 
    <table> 
        <tr> 
            <th><label for="volume_h1">H1</label></th> 
            <td><input type="text" id="volume_h1" name="volume[h1]"></td> 
        </tr> 
        <!-- .............. to volume_h24 -->
        <tr> 
            <th><label for="volume_h24">H24</label></th>
            <td><input type="text" id="volume_h24" name="volume[h24]"></td> 
        </tr> 
    </table> 
</form>

【问题讨论】：

输入是否直接位于处理程序附加到的输入旁边？如果没有，你需要nextAll()

你也应该发布相关的html。

【参考方案1】：

编辑：根据您提供的更新信息，这应该可行：

$('input[type=text]').change(function() 
    var inputs = $(this).closest('form').find('input:text');
    var nextIndex = inputs.index( this ) + 1;
    inputs.slice( nextIndex ).val( this.value );
);

---

原解决方案：

没有看到你的标记很难说，但我猜你在两者之间有一些元素。

$('input[type=text]').change(function() 
    $(this).nextAll('input:first').val("newvalue");
);

没有看到您的 HTML 就无法给出更多答案。

注意，我把选择器从'[type=text]'改成了'input[type=text]'，这样效率会更高。

【讨论】：

事实上我得到了一个包含 20 个输入文本的表单，我想将输入的值传播到该项目下的所有下一个项目，我尝试使用这个：$(this).nextall("input :text").attr('value',"newvalue");和 $(this).next("input:text").val("newvalue");但注意???

@cedosh：选择所需输入的正确方法完全取决于您的 HTML 标记。没有这个，我们只是猜测。

@cedosh：我更新了我的答案来做我认为你想做的事。可能有更好的方法，但如果不查看您的 HTML 就很难判断。

没有更多的，但这正是我想要的！我的 html 代码：

【参考方案2】：

尝试：

$(this).attr('value',"newvalue");

【讨论】：

我尝试了这个，但没有再次... $(this).next("input:text").attr('value',"newvalue");

如果相邻则只使用$(this).next().attr('value',"newvalue");

【参考方案3】：

这将改变所有这些：

$("input:text").change(function() 
    var v = $(this).next("input:text");
    v.val($(this).val());
    v.trigger('change');
)

HTML：

<input type="text">
<input type="text">
<input type="text">
<input type="text">
<input type="text">

http://jsfiddle.net/uDgnt/

【讨论】：

这看起来更像是一条评论。无论如何，为什么会发生这种情况？ .next() 只选择 1 个元素。

它没有。我测试了它并且很好奇。我认为它会是因为更改事件被添加到每个文本框，而不仅仅是一个。但是，更改事件不会在第二个文本框上触发

好的，我看到你从你的答案中删除了它。不管怎样，我想我明白你的意思了。就像有多个输入作为直接兄弟一样，其中一个的更改将触发下一个的更改处理程序，依此类推。似乎并非如此。这需要$(this).next().val('tester').change();。

【参考方案4】：

我不知道为什么，您的解决方案似乎不错，但我没有成功使用 next() 函数。

我终于做到了：

$('input[type=text]').change(function() 
       //get all the input text of the form
    var yourFormFields = $('#newform').find(':input[type=text]');
      // the index of my changed input
    $index = yourFormFields.index( this );
     //the value i entered
    $mavalue = $(this).val();

       $.each( yourFormFields, function(i, n)
    if(i>$index)
    yourFormFields.eq(i).val($mavalue);
         );

);