javascript - solucionar - ¿Cómo puedo escalar esto?

void(0) javascript href

Question

Tengo un formulario de unas pocas páginas. Para atravesar el formulario, todo lo que hago es mostrar y ocultar divs del contenedor. La última página es una página de confirmación antes de enviarla. Toma los contenidos del formulario y lo establece para que el usuario pueda ver lo que acaba de completar. Si hacen clic en uno de estos, los llevará de vuelta a la página en la que estaban (# nav1 ~ 3), se enfocará en ese campo y les permitirá ingresar un nuevo valor si es necesario.

Usando jQuery, hice variables para CADA campo / radio / verificar / seleccionar / área de texto / lo que sea. Si mi método parece tonto, por favor pwnme, pero básicamente, y este método funciona bien, pero estoy tratando de escalarlo y no tengo idea de cómo porque realmente no sé lo que estoy haciendo. ¿Pensamientos?

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);

Y así sucesivamente, con field3, 4, 5 ~ 25, etc.

Si pudieras ayudar explicando en términos no programadores, te amaría por siempre.

Answer 1

Comenzaría con una introducción a las matrices: esta se ve bastante decente, para empezar.

Envuelva su cabeza alrededor de las matrices y bucles para comenzar, y estará bien servido.

Answer 2

Sin ser demasiado complicado, puede hacer una función que maneje las cosas repetitivas. No he probado esto, pero entenderás la idea:

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")

Cuando mejore en Javascript, probablemente solo haga un bucle para manejar todas estas llamadas "valField ()", o escribiría algo que inspeccionaría su formulario, encontraría lo que hay allí y generaría controladores de eventos para pegarlo todo automáticamente. Eso ciertamente no es "n00bware", pero le da algo en qué pensar.

Además, en lugar de usar esto en tu salida:

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

Puedes reemplazarlo con el código que esté en realidad en el clic de la pestaña de navegación.

Hay docenas de formas de resolver este problema. Tómalo paso a paso.