Как скопировать значение из одного поля ввода к другим

Question

У меня есть два поля ввода:

<input type="text" id="one" name="one" /> 
<input type="text" id="two" name="two" /> 

Я хочу сделать так, чтобы все, что это напечатал в ид один будет автоматически введено в ид два.

Любые идеи о том, как это сделать? Возможно, необходим javascript?

Answer 1

Просто зарегистрируйте обработчик input с источником textfield и скопируйте его в цель textfield.

window.onload = function() { 
 
    var src = document.getElementById("one"), 
 
     dst = document.getElementById("two"); 
 
    src.addEventListener('input', function() { 
 
     dst.value = src.value; 
 
    }); 
 
}; 
 

 
// jQuery implementation 
 

 
$(function() { 
 
    var $src = $('#three'), 
 
     $dst = $('#four'); 
 
    $src.on('input', function() { 
 
     $dst.val($src.val()); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"> 
 
</script> 
 

 
<strong> With vanilla JavaScript</strong> 
 
<br /> 
 
<input type="text" id="one" name="one" /> 
 
<input type="text" id="two" name="two" /> 
 

 
<br /> 
 
<br /> 
 

 
<strong>With jQuery</strong> 
 
<br /> 
 
<input type="text" id="three" name="three" /> 
 
<input type="text" id="four" name="four" />

Fiddle