jQuery implémente l'effet d'espace réservé HTML5 example_jquery

Vous devez connaître le nouvel attribut placeholder en HTML5, n'est-ce pas ? Ce n’est pas grave si vous ne le savez pas. Si la zone de saisie contient du texte par défaut, un tel effet est souvent nécessaire. Cliquez pour faire disparaître le texte par défaut et faire apparaître le texte par défaut après avoir perdu le focus.

Aujourd'hui, je partage un morceau de code jQuery pour simuler l'effet d'espace réservé.

Code Javascript :

Copier le code Le code est le suivant :

fonction placeHolder(événement){
var self = $(this), selfDataValue = self.attr("data-value"), selfValue = self.val();
si(selfDataValue){
event.type == "clic" ? (selfValue == selfDataValue && (self.val("").css("color","#333"))) : (event.type == "flou" && (selfValue == "" && (self.val(selfDataValue).css("color","#A9A9A9"))))
}autre{
Renvoie faux ;
>
>
$(".pInputText").on("clic flou",placeHolder);

Code HTML :

Copier le code Le code est le suivant :

Certaines personnes pourraient se demander, puisque HTML5 fournit de telles fonctions, pourquoi écrire du JS ?

N'est-ce pas absurde ? Bien sûr, c'est un problème de compatibilité si IE était plus compatible avec HTML5, qui serait prêt à utiliser js pour implémenter cette chose ?