JQuery / WordPress: Aggiungere valore placeholder a form filed e rimuovere / ripristinare placeholder on “Focus”
Creare un file “custom.js” copiare e incollare il codice sottostante :
function footerForm(){
var $j = jQuery.noConflict(); // No conflict per wordpress
$j(‘.ft_nome input’).attr(‘placeholder’,’Nome’); // Aggiungo il placeholder al campo “nome” ( ripetere l’operazione per tt i campi a cui si desidera aggiungere placeholder )
$j(“.content-info .wpcf7-form input”).each(function() { // Creo una funzione ripetuta per tt i campi che compongono il form
$j(this).data(‘holder’,$j(this).attr(‘placeholder’)); // Registro il valore del placeholder
$j(this).focusin(function(){ // Assegno l’azione al focusIn
$j(this).attr(‘placeholder’,”);
});
$j(this).focusout(function(){ // Ripristino il valore iniziale al focusOut
$j(this).attr(‘placeholder’,$j(this).data(‘holder’));
});
});
$j(“.content-info .wpcf7-form textarea”).each(function() { // Ripeto l’operazione per la textarea
$j(this).data(‘holder’,$j(this).attr(‘placeholder’));
$j(this).focusin(function(){
$j(this).attr(‘placeholder’,”);
});
$j(this).focusout(function(){
$j(this).attr(‘placeholder’,$j(this).data(‘holder’));
});
});
}
Nel footer del mio template dovrò richiamare :
<script type=”text/javascript”>
var $j = jQuery.noConflict();
$j(document).ready(function($) {
footerForm();
});
</script>
Questo è tutto.