使用JQuery eq设置附加输入的值

时间:2013-12-02 07:34:40

标签: jquery

我有一个表单,用户可以在其中附加其他文本输入。这些文字输入为dna_segment_start[]dna_segment_end[]

dna_segment_end[]的第一个输入中输入值后,我想将该值设置为下一个dna_segment_start[]输入,依此类推(dna_segment_end => next dna_segment_start)。

我看过使用.eq(index),但不确定如何处理这个问题:

$('[name=dna_segment_end]').keyup(function(){


});

在表单中,第一个字段显示为:

  <tr id="first_segment">
    <td align="left"><div class="required"><input name="dna_segment_name[]" type="text" size="15" maxlength="15" /></div></td>
    <td align="left"><div class="required"><input name="dna_segment_start[]" type="text" size="6" maxlength="6" /></div></td>
    <td align="left"><div class="required"><input name="dna_segment_end[]" type="text" size="6" maxlength="6" /></div></td>
    <td align="left"><div class="required"><input class="picker" name="dna_segment_colour[]" type="text" size="5" /></div></td>
    </tr>

然后可以追加其他行:

$('#add_dna_segment').click(function(){
$("#first_segment").after("<tr><td><div class='required'><input name='dna_segment_name[]' type='text' size='15' maxlength='30' /></div></td><td><div class='required'><input name='dna_segment_start[]' type='text' size='6' maxlength='6' /></div></td><td><div class='required'><input name='dna_segment_end[]' type='text' size='6' maxlength='6' /></div></td><td><input class='picker' name='dna_segment_colour[]' type='text' size='5' /></td></tr>");

基本上我只想在下一行开始输入val以等于前一行的结束输入值。

EDITED

我现在正在使用

$("input[name*='dna_segment_end']").keyup(function(){
$('input[name*=dna_segment_start]:last-child').val($(this).val());
});

这会将dna_segment_end的值添加到名称为dna_segment_start的所有输入中,但它只需要是具有该名称的下一个输入。我认为eq可能是这里的关键并且增加了eq键的索引...我想这样的事情(但这只适用于dna_segment_start的第一次迭代

$("input[name*='dna_segment_end']").keyup(function(){
    var i = 0;
$('input[name*=dna_segment_start]').eq(i + 1).val($(this).val());
});

您可以使用test page

进行游戏

3 个答案:

答案 0 :(得分:1)

使用$('input[name=dna_segment_end]:last-child').val()捕获最后一个输入的值..然后使用它

$('#add_dna_segment').click(function(){
    $("#first_segment").after("<input type='text' value='" + $('input[name=dna_segment_end]:last-child').val() + "'"); // use your html here..this is just an example on how to set the value...
});

答案 1 :(得分:0)

如果你只想在键入一个输入时,第二个得到相同的值,那么你去:

<input id="input">
<input id="output">


var input = $("#input");
input.keyup(function(){
    $("#output").val(input.val());
});

否则进一步解释;)

答案 2 :(得分:0)

这是你在找什么? http://jsfiddle.net/EUV5J/

HTML

<input name="dna_segment_start[]" type="text" size="6" maxlength="6" id="dna_start" />
<input name="dna_segment_end[]" type="text" size="6" maxlength="6" id="dna_end" />

的jQuery

$("#dna_end").keyup(function() {
    var v = $(this).val();
    $("#dna_start").val(v);
});


$("#dna_start").keyup(function() {
    var v = $(this).val();
    $("#dna_end").val(v);
});