Come cambiare il testo del pulsante in JQuery

ho questo codice di lavoro finora:Come cambiare il testo del pulsante in JQuery

In questo momento prima di entrare nel completamento automatico JQuery UI, il pulsante legge "Ciao". Puoi digitare "elemento" nel completamento automatico dell'interfaccia utente JQuery e noterai che il pulsante ora dice "Mondo". Fare clic sul pulsante "mondo" per inserire l'elemento nell'elenco. Se si digita di nuovo l'elemento, è possibile selezionarne uno e fare clic sul pulsante Sostituisci su un elemento già presente nell'elenco. Tuttavia, una volta fatto questo, il pulsante dice ancora "mondo", ma dovrebbe dire "ciao" perché non c'è nulla nel campo di input. Se fai clic nel campo di inserimento e poi premi cancella o freccia indietro, torna a "Ciao" ma non c'è nulla da cancellare o andare a sinistra di. Penso che abbia a che fare con questa parte del codice:

$('#inputWrapper').on('keyup', '#tags', function() { 
    if($(this).val() == '') { 
     $('button.addButton').text('Hello'); 
    } else { 
     $('button.addButton').text('World'); 
    } 
});

In particolare la parte 'chiave'. Quindi la mia domanda è come posso risolvere questo in modo che ogni volta che la casella di input è vuota il pulsante legge sempre "ciao" e quando c'è un input nel campo, il pulsante legge "world"? Grazie!

fonte

2013-04-22 sbru

ti suggerisco di usare l'evento 'textchanged' invece di fare affidamento esclusivamente su keyup in quanto funzionerebbe anche se qualcuno incolla o trascina il testo nel tuo input: http://www.zurb.com/playground/jquery-text-change-custom-event – techfoobar

Wow grazie per il suggerimento! Sembra che questo sia esattamente ciò di cui ho bisogno. Come esattamente installo quel plugin? E importa dove includo la linea

Non potresti semplicemente riportare il testo su Ciao dopo averlo fatto clic? Aggiungere questo al fondo della vostra funzione click tasto:

$(this).text('Hello');

http://jsfiddle.net/r4emt/13/

fonte

2013-04-22 19:25:59

Apprezzo l'aiuto, ma questo non ha risolto il problema. Se si sostituisce, il pulsante dice ancora "mondo". – sbru

Non vedo la tua ordinata lista nel violino. Tutto quello che vedo è una casella di testo e un pulsante. –

Il pulsante aggiunge elementi all'elenco ordinabile ... – sbru

Mettere la condizione come questa

if($.trim($(this).val()) == '')

per rimuovere gli spazi indesiderati. Inoltre, si dovrebbe modificare il testo del pulsante di "Ciao" nel gestore dell'evento click

Aggiungere questo alla fine della funzione click: $(this).text('Hello');

Ecco il codice: http://jsfiddle.net/r4emt/34/

fonte

2013-04-22 19:26:34 armandocj

Apprezzo l'aiuto, ma questo non risolve il problema. Se si sostituisce, il pulsante dice ancora "mondo". – sbru

Hai una funzione che viene eseguita quando si fa clic sul pulsante? – armandocj

Sì, l'ultima funzione nel file js. – sbru

jsFiddle Working Demo

$('#inputWrapper').on('keyup', '#tags', function() { 
     if($(this).val() == "") { 
      $('button.addButton').html('Hello1'); 
     } else { 
      $('button.addButton').html('World'); 
     } 
    });

fonte

2013-04-22 19:28:01

Ho aggiornato il collegamento jsFiddle .. rivedilo –

Apprezzo l'aiuto, ma questo non risolve il problema. Se si sostituisce, il pulsante dice ancora "mondo". – sbru

ha funzionato per me. +10 ☺ – Pathros

Questa funzione è attiva solo la prima volta, perché dopo che è stato eseguito il listener di eventi sta andando sempre essere valutato dopo keyup risultante la casella di input per avere sempre un valore. Noterai che una volta che fai clic sul pulsante se digiti qualcosa e lo cancelli premendo backspace tornerà a Hello.

Per ottenere i risultati desiderati, quando si fa clic su Invia sul pulsante dal momento in cui si deseleziona dalla casella di immissione, è anche possibile modificare il testo.

See: http://jsfiddle.net/r4emt/37/

ho solo aggiunto:

//refreshes button name 
$(this).text('Hello');

alla fine della funzione clic del pulsante.

fonte

2013-04-22 20:09:06

Usa 'testo' funzione

 $("#inputWrapper").click(function() { 
     $(this).text(function(i, v){ 
      return v === 'Hello' ? 'World' : 'Hello' 
     })

fonte

2013-11-10 08:44:42

So che questo è un filo morto lungo, ma avevo bisogno di aggiungere questo, perché ho appena trascorso 2 giorni rintracciare una perdita di memoria (causata da me utilizzando codice da questa pagina).

IMPORTANTE: non utilizzare jQuerys text() sugli elementi del pulsante!

La funzione crea qualcosa nel DOM che non può essere rimosso da empty(). Se poi si chiama la funzione più volte per un lungo periodo, una grande quantità di spazzatura verrà ritagliata nel DOM, causando la rottura delle cose.

Vedi jQuery API documentation.

(Non riesci a trovare esattamente dove la sua menzionati nella documentazione, ma la sua lì da qualche parte, ho avuto modo di correre per il mio treno ora) ...

fonte

2014-02-14 14:56:59 User2

Non sembra molto affidabile, ad essere onesti. C'è una potenziale perdita descritta [qui] (http://stackoverflow.com/a/16405533/33080), ma un'istruzione come "non usare text()" senza spiegazione è troppo non specifica. –

Problemi correlati