Jquery, creare un <input> dinamico

**ivy_76** · 09-01-2013, 10:49

Ciao

sto facendo i miei primi passi in questo mondo nuovo per me, e ho qualche problemino.
Detto in due parole, ogni volta che clicco sul pulsantino con il "+" vorrei in modo dinamico dei nuovi input di tipo testo.
Estratto di codice html:

codice:

<body>
<div id='risultato'></div>

<input type='button' id='aggiungi' value='+' onclick='creaInput()'/>
</body>

Funzione jquery:

codice:

function creaInput()
{
   var r = Math.round(Math.random()*1000);
   var nome = "input1" + r;
 
   $("#risultato").html("<input type='text' id='"+nome+"' value='" + nome +"'/>
");
   
}

Anche cliccando 100 volte sul pulsante, ottengo sempre soltanto un input. Ogni volta cambia il nome e il relativo valore, per cui, in realtà sta creando dei nuovi input, ma anzichè metterli uno sotto l'altro, a video ne ho sempre uno solo. Graficamente parlando vorrei ottenere questa situazione:

<input nuovo nome =138>
<input nuovo nome =141>
ecc ecc

pulsante "+"

**Vindav** · 09-01-2013, 10:56

codice:

$("#aggiungi").click(function(){
   var r = Math.round(Math.random()*1000);
   var nome = "input1" + r;
   $("#risultato").append("<input type='text' id='"+nome+"' value='" + nome +"'/>
");
});

**ivy_76** · 09-01-2013, 11:03

Grande ! Perfetto ! Cosi funziona!

Domanda :
Funziona anche cambiando la mia funzione in questo modo:

codice:

$("#risultato").append("<input type='text' id='"+nome+"' value='" + nome +"'/>
");

Che differenza c'è tra scrivere la funzione come ho fatto io e come l'hai scritta tu?

**Vindav** · 09-01-2013, 11:12

Nel tuo codice stai mischiando codice js con codice jquery, visto che nel primo post parli di "funzione jquery" te l'ho riscritta con la sintassi corretta.

Discussione: Jquery, creare un <input> dinamico

Strumenti discussione

Ricerca discussione

Visualizza

Jquery, creare un <input> dinamico

Permessi di invio