Question

当输入A被修改时，jQuery可以将一个输入字段的文本同步或复制到另一个输入字段吗？例如：

<input id="input_A" type="text" /> ...If I type something here

<input id="input_B" type="text" /> ... It will be copied here

jQuery可以这样做吗？

Answer 1

试试这个：

$("#input_A").bind("keyup paste", function() {
    $("#input_B").val($(this).val());
});

对于jQuery 1.7+，请使用on：

$("#input_A").on("keyup paste", function() {
    $("#input_B").val($(this).val());
});

Example fiddle

- 2017年8月更新 -

The input event is now well supported，因此您可以使用它来代替keyup和paste事件的组合：

$("#input_A").on("input", function() {
  $("#input_B").val(this.value);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="input_A" type="text" />
<input id="input_B" type="text" />

Answer 2

在写入期间，粘贴等值将被复制。在jQuery＆lt; 1.7而不是on使用bind。

$( "#input_A" ).on( "paste keyup", function() { 
     $( "#input_B" ).val( $( this ).val() );
});

Answer 3

迟到的答案，但我更喜欢这种方式，因为它不需要多个元素ID：

$('input.sync').on('keyup paste', function() {
     $('input.sync').not(this).val($(this).val());
});

盖瑞特

Answer 4

是的，它可以。绑定按键或键盘事件并复制值：

$('#input_A').keyup(function() {
    $('#input_B').val($(this).val());
});

或者，如果您只想在用户完成编辑后复制该值，请使用具有相同处理程序的blur事件。这样做还有一个额外的好处，即如果用户将文字粘贴到input_A，它也会被复制到input_B。

$('#input_A').blur(function() {
    $('#input_B').val($(this).val());
});

这是working example with keyup和one with blur。

同步2个输入字段，可以使用jQuery完成吗？

4 个答案: