Inadequate operation of the input block, how to fix it?

Question

JavaScript

The point is this. The site has several forms, each has repeated input blocks (with phone, name) with the same name attributes (name - name, phone - phone), when I make changes to one of the fields using jquery, the changes occur with all fields with the same name attribute. Part of the forms in my pop-up windows (display:none). With the first change, everything goes well, but with further changes, the "magic" begins: when clearing the value value of one of the form fields, in some other forms the same field remains unchanged, although the developer panel shows that the value value is empty, but the form in the window The browser does not agree with me. It also happens the other way around: in the browser window, the placeholder value is displayed, while the developer panel shows that the value value is not empty!
Code:

$(document).on('focusout', 'input', function(){
var name = $(this).val();
$("input[name=name]").attr({"value ":name});
});

Answer 1

So all inputs with the same name will take on the value of the changed:

$(document).on('focusout', 'input', function(){
  var name = $(this).attr('name');
  var value = $(this).val();

  $('input[name=' + name + ']').val(value);
});

Demo.

Answer 2

You don't look in the inspector for the value attribute, use it only to set the initial value when generating the page.
To change, use .val() to change the value of a text field and .prop() for checkboxes.
If you have several identical fields, iterate over them with .each() and call val for each one
Read here api.jquery.com/prop point Attributes vs. Properties there is a line The same is true for other dynamic attributes, such as selected and value.