Сохранить jquery добавленный ввод

Question

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

<form>
<select>
    <option>Select people</option>
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
    <option value="4">Four</option>
    <option value="5">Five</option>
    <option value="6">Six</option>
</select>

<p>
<div id="names"></div>
</p>
</form>
<script>
$('select').on('change', function() {
  $("#names").html('')
  var count=$(this).val()
   
  var str='';
  for(var i=0; i<count; i++){
    str+='<input type="text"><br/><br/>'
  }
  
  $("#names").append(str)
  
});


</script>

Добавленное поле ввода не сохраняется после обновления страницы sh или при возврате со следующей страницы. Как мне изменить поля ввода и автоматически заполнить поля ввода на refre sh

Answer 1

Как я упоминал в своем комментарии, вы можете сделать что-то вроде этого.

Сохраните значение где-нибудь в постоянном хранилище, например localStorage, и вы можете получить его даже при refre sh.

$('select').on('change', function() {
    $("#names").html('')
    var count=$(this).val()
    
    var str='';

    if (localStorage.getItem("str") !== null) {
        str = localStorage.getItem("str");
    }

    for(var i=0; i<count; i++){
      str+='<input type="text"><br/><br/>'
    }
    
    $("#names").append(str)
    
    localStorage.setItem("str", str);
});