Maison > interface Web > tutoriel HTML > Exemple d'utilisation d'images pour remplacer les boutons de soumission en HTML

Exemple d'utilisation d'images pour remplacer les boutons de soumission en HTML

黄舟
Libérer: 2017-07-22 14:07:12
original
3955 Les gens l'ont consulté

1. Utilisez des images au lieu des boutons de soumission

Lorsqu'il n'y a qu'un seul bouton de soumission, il peut être facilement implémenté sans ajouter de fonction événementielle. Le code est :

<input type = "image"&#39; name = "..." src = "url" width= “” height = “”  border = “”>
Copier après la connexion

sauf. que l'étiquette est remplacée par À l'exception du type d'entrée = "image", les autres attributs sont les mêmes que ceux de la balise .

2. Remplacez tous les boutons du formulaire par des images

Le format d'image pour remplacer le bouton de soumission est

<input type = "image" name = "..." src = "..."inclick ="document.foormName.submit()">
Copier après la connexion

Le format d'image de code pour remplacer le bouton de réinitialisation est :

<input type = "image" name ="..." src = "..." onclick = "document.formName.reset()">
Copier après la connexion

Remarque : fromName voici l'attribut name du formulaire

3. Vérification de la soumission du formulaire :

<script>
function checkdate(){
//取得输入数据
userName = document.RedForm.userName.value
userEmail = document.RedForm.userEmail.value
//如果没有输入名字
if(userName== ""){alert("请输入名字");
document.RedForm.userName.focus();
return false;
}else{
//如果没有输入Email,或者Email地址错误(不含@)
if(userEmail == "")||(userEmail.indexOf("@")== 1)){alret("请输入Email地址");
document.RedForm.userEmail.focus();
return false;
}else return true;
}
}
</script>
Copier après la connexion

4. Soumettez le formulaire avec n'importe quel élément

Soumettez le formulaire via onclick = "document.from.submit()" et réinitialisez le formulaire avec onclick = "document.from.reset()", comme ceci. N'importe quel élément peut soumettre le formulaire.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal