communauté Apprendre Bibliothèque d'outils Loisirs

Français

Maison > interface Web > js tutoriel > javascript写的一个表单动态输入提示的代码_表单特效

javascript写的一个表单动态输入提示的代码_表单特效

WBOY

Libérer： 2016-05-16 19:09:38

original

959 Les gens l'ont consulté

<title></title> 
  <style type="text/css"> 
  *{ 
  margin:0px;padding:0px;font-size:12px; 
  } 
    input{ 
      width:100px;height:20px;border:1px solid #ccc; 
    }

</style>

<script language="javascript"> 
function tips(id,str){ 
var l=document.getElementById(id).offsetLeft+120; 
var t=document.getElementById(id).offsetTop; 
document.getElementById("tips").innerHTML="提示："+str; 
document.getElementById("tips").style.left=l+"px"; 
document.getElementById("tips").style.top=t+"px"; 
document.getElementById("tips").style.display=""; 
} 
function outtips(){ 
    document.getElementById("tips").style.display='none'; 
} 
</script> 
<div id="tips" style="position:absolute;border:1px solid #ccc;padding:0px 3px;color:#f00;display:none;height:20px;line-height:20px;background:#fcfcfc"></div>

姓名：<input type="text" id="username" onfocus="tips('username','姓名长度最多16个字符')" onblur="outtips()">

密码：<input type="password" id="password" onfocus="tips('password','密码长度必须在3-18位之间')" onblur="outtips()">

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

比较简单，自己闲着无聊写的，很久没有写过代码了。。。。

Étiquettes associées：

javascript写的一个表单动态输入提示的代码

source：php.cn

Article précédent：javascript动画效果类封装代码_javascript技巧 Article suivant：用js实现的一个根据内容自动生成表格的函数_javascript技巧

Déclaration de ce site Web

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Derniers articles par auteur

Qu'est-ce qu'une NullPointerException et comment y remédier ?

2024-10-22 09:46:29
De novice à codeur : votre voyage commence par les principes fondamentaux du C

2024-10-13 13:53:41
Débloquer le développement Web avec PHP : guide du débutant

2024-10-12 12:15:51
Démystifier C : un chemin clair et simple pour les nouveaux programmeurs

2024-10-11 22:47:31
Libérez votre potentiel de codage : programmation C pour les débutants absolus

2024-10-11 19:36:51
Libérez votre programmeur intérieur : C pour les débutants absolus

2024-10-11 15:50:41
Automatisez votre vie avec C : scripts et outils pour les débutants

2024-10-11 15:07:41
PHP Made Easy : vos premiers pas dans le développement Web

2024-10-11 14:21:21
Construisez n'importe quoi avec Python : un guide du débutant pour libérer votre créativité

2024-10-11 12:59:11
La clé du codage : libérer la puissance de Python pour les débutants

2024-10-11 12:17:31

Derniers numéros

Confus lors de l'envoi de données d'image binaire (jpg) au backend AWS Lambda via AWS API Gateway Toutes mes excuses par avance s'il me manque quelque chose de simple ! J'ai envoyé avec su...

Depuis 2024-04-05 13:09:55

0

1

389

Ajoutez des valeurs supplémentaires aux champs de données de format affichés à l'aide de javascript J'essaie d'y parvenir : je souhaite créer un formulaire qui collecte les données saisies p...

Depuis 2024-04-04 15:17:13

0

1

3589

Le débordement de contenu dans la fenêtre empêche le défilement et masque le nouveau contenu Je suis actuellement en train de construire un programme de système de roulette (c'est plu...

Depuis 2024-04-03 21:24:55

0

1

285

Comment puis-je créer un événement jQuery qui affiche le formulaire lors d'un double-clic, mais ne déclenche pas l'événement double-clic du formulaire ? Je souhaite écrire un événement selon lequel lorsque l'utilisateur double-clique sur une c...

Depuis 2024-04-01 13:42:52

0

2

445

Coupez et calculez le numéro de mobile dans le champ de zone de texte du formulaire php J'ai un champ de zone de texte dans mon formulaire où je peux copier et coller un numéro d...

Depuis 2024-03-31 08:46:11

0

1

314

Rubriques connexes

Plus>

Recommandations populaires

Tutoriels populaires

Plus>

Tutoriels associés

Recommandations populaires

Derniers cours

Derniers téléchargements

Plus>

effets Web

Code source du site Web

Matériel du site Web

Modèle frontal