user3688491
user3688491

Reputation: 167

Bind two inputs so they display the same text even if one of them was changed using only native JS

I know how do that with Jquery http://jsfiddle.net/69UAT/ But can you help me with native JS. jQuery:

$('.inputs').on('keyup',function(){
    $(this).parent().not(this).find('.inputs').val($(this).val());
}
);

HTML:

<div>
    <input type="text" class="inputs" value="hello">
    <input type="text" class="inputs" value="John">
</div>

Upvotes: 0

Views: 145

Answers (1)

erdysson
erdysson

Reputation: 1480

const inputs = document.querySelectorAll(".inputs");
inputs.forEach(input => {
  input.addEventListener("keyup", e => {
    let value = e.target.value;
    inputs.forEach(input => input.value = value);
  });
});

Upvotes: 2

Related Questions