Question

我有一个带有可变数量输入的表格作为数组

<form>
<label for="same">all the same as first?</label>
<input type="text" id="foo[1]" name="foo[1]" value="" />
<input type="text" id="foo[2]" name="foo[2]" value="" />
<input type="text" id="foo[3]" name="foo[3]" value="" />
<input type="text" id="foo[4]" name="foo[4]" value="" />
<input type="text" id="foo[5]" name="foo[5]" value="" />
</form>

我的想法是当我在第一个字段（foo[1]）中放入一些值时，我需要jQuery或Javascript将#foo[1]中的值复制到#foo[2]，#foo[3]，等取决于阵列。

Answer 1

$('input').on('input', function(){
    $(this).siblings().val($(this).val());
});

无法判断你是想要第一个还是全部。如果只是第一个，你可以使用id或jQuery进行定位。

$('input').eq(0).on('input', function(){});

Answer 2

您是否需要以下行为：

＆＃13;

$(document).ready(function(){
  
  $("input[id^=foo\\[]").prop("disabled",true); //disable all elements first
  $("input#foo\\[1\\]").prop("disabled",false); //then enable the first one 
  
  $("input#foo\\[1\\]").change(function(){
    var source = $(this);
    var currentVal = $(source).val();
    $("input[id^=foo\\[]").each(function(){
      if(!$(this).is(source))
        $(this).val(currentVal);
    });
  });  
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<form>
<label for="same">all the same as first?</label>
<input type="text" id="foo[1]" name="foo[1]" value="" />
<input type="text" id="foo[2]" name="foo[2]" value=""/>
<input type="text" id="foo[3]" name="foo[3]" value=""/>
<input type="text" id="foo[4]" name="foo[4]" value=""/>
<input type="text" id="foo[5]" name="foo[5]" value=""/>
</form>

＆＃13;

Answer 3

像this

这样的东西

HTML

<form>
    <label for="same">all the same as first?</label>
    <input type="text" id="foo[1]" name="foo[1]" value="" />
    <input type="text" id="foo[2]" name="foo[2]" value="" />
    <input type="text" id="foo[3]" name="foo[3]" value="" />
    <input type="text" id="foo[4]" name="foo[4]" value="" />
    <input type="text" id="foo[5]" name="foo[5]" value="" />
</form>

的JavaScript

$("input[id=foo\\[1\\]").on("input", function (){
   $(this).siblings().val($(this).val());
});

如果你想让对方只读：

$("input[id^=foo\\[]:not([id=foo\\[1\\]])").attr("readonly", "readonly");

jQuery根据第一个输入的文本框值填充数组命名的表单字段

3 个答案: