2012-04-22 13 views
21

Uso il cambiamento (gestore) per ascoltare cambiare eventi in un'area di testo, ma ricevo solo un evento quando la textarea perde lo stato attivo, ma desidero ricevere un evento non appena il valore cambia.Cambio JQuery che non si attiva fino a sfocatura

$("#text_object").change(listener); 
function listener(dom){ 
alert("I'm not getting here before the textarea loses focus"); 
} 
+4

Sembra che tu voglia 'keydown' o' keyup'. –

+0

Ho provato la chiave: http://stackoverflow.com/questions/10269571/form-event-incompatibility-obetween-browsers-how-to-address –

risposta

22

Purtroppo il browser riconosce solo un cambiamento quando il campo offusca, così si potrebbe desiderare di provare a collegare un ascoltatore keyup. Non è la soluzione più elegante, purtroppo.

Dettagli a http://api.jquery.com/keyup/.

+8

Quando si utilizza la chiave è possibile incollare il testo con il mouse senza l'attivazione dell'evento. – Oscar

6

puoi farlo. solo assicuratevi di dare la textarea un tag id

$(document).ready(function(){ 
     $('.addtitle').keyup(function(event) { 
      if(event.keyCode==13) { 

} 
}); 
}); 

nel mio caso qui, im sparando la funzione del tasto Invio (come funzioni Facebooks).

EDIT: anche se si dispone di più di una textarea in una pagina, si dovrebbe fare questo:

$(document).ready(function(){ 
     $('textarea[name=mynamevalue]').keyup(function(event) { 
      if(event.keyCode==13) { 

} 
}); 
}); 
1

Ecco quello che faccio:

/* Get the current value of the input and save it 
* in a data attribute before any change is made to it */ 
$(document).on('keydown','input', function(){ 
    $(this).data('value',$(this).val()); 
}); 

/* Compare the values after the keyup event*/ 
$(document).on('keyup','input', function(){ 
    if($(this).data('value') != $(this).val()){ 
    console.log($(this).attr('name')); 
    } 
}); 

Così l'evento "keydown" è sparato prima che la pressione del tasto faccia effettivamente qualche modifica all'elemento su cui è chiamato, "keyup" è dopo l'attivazione. Così ho afferrare il valore prima e confrontare dopo il nuovo valore, allora io fare quello che devo, se c'è un cambiamento ..

Spero che questo aiuta

5

secondo la risposta giusta qui javascript change event on input element fires on only losing focus

si dovrebbe fare qualcosa di simile

$('#name').on('change textInput input', function() { 
 
     
 
});

Tuttavia ho trovato che avere sia textInput e gli eventi di input può causare l'evento al fuoco due volte, non si vuole che, quindi basta fare

$('#name').on('change input', function() { ...

+0

sì! questo è quello di cui ho bisogno, funziona perfettamente in chrome, ma non so come funzioni su altri broswers –

+0

Funziona come un incantesimo! Questa dovrebbe essere la risposta accettata! – luizrogeriocn

0

Ho creato questo per voi, non è il più elegante soluzione, ma funziona

JS:

<script> 
$(document).ready(function (d) { 

    /* set initial value to "" (empty string), and not null 
     we're going to use this to check if the value of the current text field has been changed */ 
    val = ''; 

    setInterval(function() { 
     if (val !== $('textarea[name="checktext"]').val()) { 

      // Value is not the same, fire action 
      alert('val is different'); 

      // Update the current value 
      val = $('textarea[name="checktext"]').val(); 
     } else { 
      // Val is the same as textarea value 
     } 

    }, 50); 

}); 
</script> 

HTML:

<textarea name="checktext"></textarea> 

questo script funziona solo per quella specifica area di testo, puoi cambiarlo oppure puoi impostare val come un array di input di testo.

sto solo mostrando l'idea dietro di esso, per usare setInterval di x millisecondi per verificare se il valore di immissione del testo è lo stesso che il valore del Val o qualunque nome della variabile che si desidera utilizzare. se non corrispondono, significa che è stato cambiato, se corrispondono, significa che nulla è cambiato.

spero che tu lo abbia trovato utile.

Tuttavia HTML5 ha la soluzione

<script> 
$(document).ready(function (d) { 

    $('textarea[name="checktext"]').on('input', function() { 
     alert('changed'); 
    }); 
}); 
</script> 
0

Questa domanda è vecchia, ma può aiutare le persone come me;)
È possibile setInterval() nel caso in attivo per l'input e chiaro questo intervallo di sfocatura e relativo funzione penso che questo sia un buon modo per prendere il cambiamento di input da soli.
Esempio:

var myInterval; 
$("#text_object").focus(function (event) { 
    myInterval = setInterval(function() {    
     listener(event); 
    }, 100); 
}); 

$("#text_object").blur(function (event) { 
    clearInterval(myInterval); 
}); 

function listener(event){ 
    clearInterval(myInterval); 

    alert("I'm not getting here before the textarea loses focus"); 
} 

Speranza che aiuta.

Problemi correlati