Обновление Jquery на кнопке "Назад"

Question

<div id="inputs" style="margin:0;"></div>

$('#addtpcs').change(function() {
  var selectedValue = $(this).val();

  var targetDiv = $("#inputs").html("");
  var a=1;
  for(var i = 0; i < selectedValue; i++) {
     targetDiv.append($("<dd><label for=\"addtpcs\" class=\"label\">Additional PC "+a+"</label><input id=\"addtpcs"+a+"\" type=\"text\"/></dd>"));
    a++;
  }
});

У меня есть поле выбора (с именем addtpcs) в форме, которая уже загружена на страницу, в которой есть номера (т.е. 1,2,3,4 и т. Д.) В форме. Приведенный выше код отлично работает для динамически добавляемых полей ввода type = text, основанных на числе, выбранном в поле выбора. Однако это не так хорошо работает после того, как вы нажмете кнопку "Отправить", а затем используете кнопку "Назад". Поле выбора показывает номер, но текстовые вводы не загружаются без необходимости щелкать раскрывающееся меню выбора и выбирать другой номер, а затем снова щелкнуть по нему и выбрать предыдущий номер.

Мне бы хотелось, чтобы в браузере была нажата кнопка "Назад", чтобы значение отображалось в форме, а текстовые поля отображались в зависимости от значения в поле выбора.

В Jquery, как бы я проверить, что значение при загрузке страницы и при изменении без написания кода дважды?

Спасибо,

Wayne

Обновление У меня есть код, который проверяет флажок уже на форме, если выбрана кнопка "Назад". Я ищу что-то подобное для поля выбора. Приведенный ниже код при нажатии кнопки "Назад" проверит, установлен ли флажок, а затем, если это так, отобразит два скрытых текстовых поля в форме.

$(function() {
if ($("#prevcredit").is(':checked')){
    $("#credit_amount").show();
    $("#credit_amount2").show();
}
else {
     $('#credit_amount2').val('0.00');
}
});

Answer 1

Хорошо, я решил это.

Шаг 1: HTML Часть кода:

<div id="inputs" style="margin:0;"></div>

Шаг 2: функция JavaScript

Создайте функцию в javaScript, которая добавляется к targetDiv. Эта функция будет принимать 1 аргумент. Это будет значение того, сколько ящиков нужно добавить.

function displayTextBoxes(value)
{
a=1;
targetDiv = $("#inputs").html("");
for(var i = 0; i < value; i++) {
     targetDiv.append($("<dd><label for=\"addtpcs\" class=\"label\">Additional PC "+a+"</label><input id=\"addtpcs"+a+"\" type=\"text\"/></dd>"));
    a++;
  }
}

Шаг 3: Создайте вызовы функций JQuery

Первая функция просматривает значение того, что связано с id addtpcs. Это позаботится о просмотре значения, когда пользователь нажимает кнопку возврата в браузере. Второй проверяет, изменилось ли значение, пока вы находитесь в форме.

$(function() {
var selectValue = $('#addtpcs').val();
displayTextBoxes(selectValue);
});

$('#addtpcs').change(function() {
  var selectedValue = $(this).val();
  displayTextBoxes(selectedValue);
});