suchen

Heim >Web-Frontend >js-Tutorial >Einfache Formularvalidierung, implementiert in javascript_javascript skills

Einfache Formularvalidierung, implementiert in javascript_javascript skills

WBOY
WBOYOriginal
2016-05-16 15:50:471041Durchsuche

Einige Formularüberprüfungen werden im Hintergrund durchgeführt, andere verwenden JavaScript, um die grundlegende Überprüfung im Frontend durchzuführen. Hier finden Sie eine Einführung in die JS-Implementierung einfachste Formularvalidierung. Das Codebeispiel lautet wie folgt:

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<title>脚本之家</title>
<script type="text/javascript"> 
function chkform(){ 
 if(document.getElementById("username").value==""){ 
  alert("用户名不能为空！"); 
  return false; 
 } 
 if(document.getElementById("pw").value=="") { 
  alert("密码不能为空！"); 
  return false; 
 } 
} 
</script> 
</head> 
<body> 
<form action="" name="myform"> 
 <table> 
  <tr> 
   <td>用户名:</td> 
   <td><input type="text" name="username" id="username" /></td> 
  </tr> 
  <tr> 
   <td>密码:</td> 
   <td><input type="password" name="pw" id="pw" /></td> 
  </tr> 
  <tr> 
   <td colspan="2"><input type="submit" value="提交"></td> 
  </tr> 
 </table> 
</form> 
</body> 
</html>

Der obige Code implementiert die grundlegendste Formularüberprüfung, das heißt, der Formularinhalt darf nicht leer sein. Hier ist eine kurze Einführung in den Implementierungsprozess:

1. Erstellen Sie im JavaScript-Code die Funktion chkform(), um das Formular zu überprüfen: 

document.getElementById("username").value

Der obige Code kann den Wert des Objekts mit der ID-Benutzername abrufen und dann mithilfe der if-Anweisung feststellen, ob der Wert leer ist. Diese Anweisung ist sehr wichtig, andernfalls wird das Formular zurückgegeben Selbst wenn der Formularinhalt leer ist, wird der Überprüfungseffekt nicht erreicht. Dasselbe gilt für die zweite if-Urteilsanweisung, die hier nicht vorgestellt wird.

2.onclick="return chkform()", die Funktion dieser Anweisung besteht darin, dass beim Klicken auf die Schaltfläche "Senden" die Funktion "chkform()" ausgeführt wird, um das Formular zu überprüfen. Dies wird hier besonders hervorgehoben Vergessen Sie, Return hinzuzufügen.

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, er gefällt Ihnen allen.

Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：jQuery-Methode zum Realisieren einer Popup-Verlaufsebene per Mausklick_jqueryNächster Artikel：jQuery-Methode zum Realisieren einer Popup-Verlaufsebene per Mausklick_jquery

In Verbindung stehende Artikel

Mehr sehen