Come posso aggiungere il valore della casella di testo inserito dall’utente per etichettare dynamicmente usando jquery?

Ciao Come posso aggiungere valore casella di testo sul pulsante clic sull’etichetta come questo

http://jsfiddle.net/NT4Zr/29/

Nel codice sopra l’utente può digitare il suo passatempo e aggiungerlo nel modulo utilizzando il link aggiungi hobby. quando l’utente preme aggiungi collegamento hobby il valore della casella di testo deve essere aggiunto all’etichetta e per ogni voce nuova etichetta creata dynamicmente.

dopo aver aggiunto gli hobbies l’utente può liberarsi di cancellare gli hobby usando il pulsante Elimina.

Come lo posso fare?

Qualcosa di simile al sotto sarebbe quello che stai cercando?

 

Add Hobby

Alcune note su questa implementazione:

  • Ho scelto di usare una lista non ordinata su un tavolo perché è meno lavoro e, discutibilmente, più semanticamente corretta.
  • Se è necessario aggiungere un elemento di input (o simile) al modulo per tenere traccia degli hobbies aggiunti, è abbastanza semplice da fare (basta seguire lo schema sopra per build, aggiungere e rimuovere elementi; al momento, il gestore di eliminazione rimuove solo l’elemento dell’elenco, ma potrebbe rimuovere anche un elemento di input.Tuttavia, non ero sicuro di come avessi pianificato di elaborare questi dati, quindi non è chiaro quale sarebbe la migliore informazione da inserire negli elementi di input.
  • Ho rimosso alcuni elementi HTML (ad esempio l’intestazione “Hobbies”, il pulsante Annulla) in quanto sembravano confondere l’esempio. Non c’è motivo per cui debbano essere omessi, ma speravo di mantenere le cose concise.