Как я могу масштабировать это?

Question

У меня есть форма длиной в несколько страниц. Чтобы пройти через форму, я лишь показываю и скрываю контейнерные элементы. Последняя страница является страницей подтверждения перед отправкой. Он берет содержимое формы и размещает ее, чтобы пользователь мог видеть, что он только что заполнил. Если они нажмут на одну из них, она вернется на страницу, на которой они находились (# nav1 ~ 3), сосредоточится на этом поле и позволит им ввести новое значение, если потребуется.

Используя jQuery, я сделал переменные для КАЖДОГО поля / radio / check / select / textarea / что угодно. Если мой метод кажется глупым, пожалуйста, напишите мне, но в основном, и этот метод уже работает нормально, но я пытаюсь масштабировать его, и я понятия не имею, как, потому что я действительно не знаю, что Я делаю. Мысли?

  var field1 = '<a href="#" 
    onclick="$(\'#nav1\').click();$(\'input#field-1\').focus();" 
    title="Click to edit">' + 
    $('input#field-1').val() + '</a>';
    $('#field1-confirm').html(field1);

  var field2 = '<a href="#" 
    onclick="$(\'#nav1\').click();$(\'input#field-2\').focus();" 
    title="Click to edit">' + 
    $('input#field-2').val() + '</a>';
    $('#field2-confirm').html(field2);

И так далее, с полями 3, 4, 5 ~ 25 и т. д.

Если бы вы могли помочь объяснением в непрограммистских терминах, я бы любил вас всегда.

Answer 1

Не становясь слишком сложным, вы можете создать функцию, которая обрабатывает повторяющиеся вещи. Я не проверял это, но вы поймете идею:

function valField(fieldName,navName) {
    var output = '<a href="javascript://" onclick="$(\''+navName+'\').click();$(\'input#'+fieldName+'\').focus();" title="Click to edit">' + $('input#'+fieldName).val() + '</a>';
 $('#'+fieldName+'-confirm').html(output);
}

valField("field-1","nav1")
valField("field-2","nav1")
valField("field-293","nav3")

Когда вы станете лучше в Javascript, вы, вероятно, просто сделаете цикл для обработки всех этих " valField () " звонки, или вы написали бы что-то, что проверяло бы вашу форму, находило что там и генерировало обработчики событий, чтобы автоматически склеивать все вместе. Это, конечно, не "n00bware", но это дает вам возможность подумать.

Кроме того, вместо использования этого в выходных данных:

$(\''+navName+'\').click();

Вы можете заменить его на любой другой код, который находится на вкладке навигации.

Есть десятки способов решить эту проблему. Делайте это по одному шагу за раз.

Answer 2

Я бы начал с введения в массивы: этот выглядит довольно прилично, для стартеры.

Оберните голову вокруг массивов и циклов, чтобы начать, и вы будете хорошо обслуживаться.