jQuery - 将值从一个输入传递到另一个输入

I have a form, with several input fields that are title, name, address etc

我有一个表单,有几个输入字段,标题,名称,地址等

What I want to do, is to get these values and 'put them' into values of other input fields. For example

我想要做的是获取这些值并将它们“放入”其他输入字段的值中。例如

<label for="first_name">First Name</label>
<input type="text" name="name" />

<label for="surname">Surname</label>
<input type="text" name="surname" />

<label for="firstname">Firstname</label>
<input type="text" name="firstname" disabled="disabled" />

So If I enter John in the first_name field, then the value of firstname will also be John.

因此,如果我在first_name字段中输入John,那么firstname的值也将是John。

Many thanks

4 个解决方案

#1

Assuming you can put ID's on the inputs:

假设您可以将ID放在输入上:

$('#name').change(function() {
    $('#firstname').val($(this).val());
});

JSFiddle Example

Otherwise you'll have to select using the names:

否则你将不得不选择使用名称:

$('input[name="name"]').change(function() {
    $('input[name="firstname"]').val($(this).val());
});

#2

It's simpler if you modify your HTML a little bit:

如果你稍微修改一下HTML会更简单:

<label for="first_name">First Name</label>
<input type="text" id="name" name="name" />

<label for="surname">Surname</label>
<input type="text" id="surname" name="surname" />

<label for="firstname">Firstname</label>
<input type="text" id="firstname" name="firstname" disabled="disabled" />

then it's relatively simple

然后它相对简单

$(document).ready(function() { 
    $('#name').change(function() {
      $('#firstname').val($('#name').val());
    });
});

#3

Add ID attributes with same values as name attributes and then you can do this:

使用与name属性相同的值添加ID属性,然后您可以执行以下操作:

$('#first_name').change(function () {
  $('#firstname').val($(this).val());
});

#4

Get input1 data to send them to input2 immediately

获取input1数据以立即将它们发送到input2

<div>
<label>Input1</label>
 <input type="text" id="input1" value="">
</div>

</br>
<label>Input2</label>
<input type="text" id="input2" value="">

<script type="text/javascript">
        $(document).ready(function () {
            $("#input1").keyup(function () {
                var value = $(this).val();
                $("#input2").val(value);
            });
        });
</script>

#1