jQuery – Mostra e nasconde gli ultimi 4 numeri di un numero di telefono

Come posso mostrare e hide gli ultimi 4 numeri di un numero telefonico sostituendolo con qualcosa come 949XXXX e quando si fa clic su di esso viene visualizzato il resto dei numeri?

Voglio solo farlo con jQuery / JavaScript.

949XXXX

 $('#number').click(function() { $(this).find('span').text( $(this).data('last') ); }); 

Esempio: http://jsfiddle.net/4fzaG/


Se vuoi passare ad ogni clic, fai questo:

 $('#number').toggle(function() { $(this).find('span').text( $(this).data('last') ); },function() { $(this).find('span').text( 'XXXX' ); }); 

Esempio: http://jsfiddle.net/4fzaG/1/


O se non vuoi usare attributi personalizzati, fai questo:

 
949XXXX1234

 $('#number').click(function() { $(this).find('span').toggle(); }); 

Esempio: http://jsfiddle.net/4fzaG/3/


MODIFICARE:

Per motivi di degradazione graduale, è ansible che la visualizzazione predefinita mostri il numero e lo offusca solo se JavaScript è abilitato.

 
9491234

 $('#number').toggle(function() { $(this).find('span').text( 'XXXX' ); },function() { $(this).find('span').text( $(this).data('last') ); }) .click(); 

Esempio: http://jsfiddle.net/4fzaG/4/

Sì, puoi farlo in quel modo (vedi jsfiddle come prova ):

 jQuery('body').delegate('span[data-replace]', 'click', function(event){ event.preventDefault(); var older_value = jQuery(this).html(); jQuery(this) .html(jQuery(this) .attr('data-replace')) .attr('data-replace',older_value); }); 

dove i numeri di telefono dovrebbero essere codificati in questo modo:

 555-XX-XX 

Questo mostrerà / nasconderà le ultime lettere con ogni clic. Lega gli eventi a (puoi cambiarli in alcuni contenitori con i numeri di telefono) e li assegna agli elementi corretti sulla pagina, quindi l’uso di AJAX non sarà un problema (non dovrai riattaccare gli eventi ).

Risposta molto rapida: più numeri di telefono bug 🙂

 Telefon : 0 216 457 XX XX 
 
Telefon 07XX XXX XXX Arata numarul de telefon