jQuery valore di input focus e blur

Question

Ho il seguente codice in modo che quando un utente seleziona una casella di input il valore scompare, ma il valore predefinito verrà quindi reinserito una volta che l'utente lo interrompe.

 $(function() { 
      var defaultText = ''; 
      $('input[id=input]').focus(function() { 
       defaultText = $(this).val(); 
       $(this).val(''); 
      }); 
      $('input[id=input]').blur(function() { 
       $(this).val(defaultText); 
      }); 
     }); 

Tuttavia, non è esattamente come lo voglio. Se un utente inserisce del testo, non voglio che il testo predefinito sovrascriva ciò che l'utente ha inserito. Sono anche abbastanza nuovo per jQuery quindi qualsiasi aiuto sarebbe molto apprezzato.

Answer 1

Nella tua focus() metodo si dovrebbe verificare per vedere se è uguale al defaultText prima di cancellarlo, e nella funzione blur(), è solo bisogno di controllare se la val() è vuota prima di impostare il defaultText. Se si sta lavorando con più input, è preferibile utilizzare una classe piuttosto che un ID, quindi il selettore sarà input.input quando la classe è "input". Anche se fosse un ID, lo farei riferimento come input#input.

// run when DOM is ready() 
$(document).ready(function() { 
    $('input.input').on('focus', function() { 
     // On first focus, check to see if we have the default text saved 
     // If not, save current value to data() 
     if (!$(this).data('defaultText')) $(this).data('defaultText', $(this).val()); 

     // check to see if the input currently equals the default before clearing it 
        if ($(this).val()==$(this).data('defaultText')) $(this).val(''); 
    }); 
    $('input.input').on('blur', function() { 
     // on blur, if there is no value, set the defaultText 
     if ($(this).val()=='') $(this).val($(this).data('defaultText')); 
    }); 
}); 

Impostarlo in azione in this jsFiddle.

Answer 2

Nel vostro gestore di sfocatura basta controllare se l'utente non ha scrivere nulla, in quel caso rimesso il testo predefinito, in questo modo:

  $('input[id=input]').blur(function() { 
      if ($(this).val() == '') { 
       $(this).val(defaultText); 
      } 
     }); 

Answer 3

una vecchia questione + Cosa non mi piace quando la gente offrono un'altra soluzione, invece di risolvere il mio problema, ma comunque: l'utilizzo di un attributo segnaposto HTML con un plugin jQuery risolverebbe il problema.

Si potrebbe anche utilizzare gli attributi di dati HTML e scrivere/leggere da quello.