양식 확인은 거의 필수입니다. 일부 양식 확인은 백그라운드에서 완료되고 일부는 JavaScript를 사용하여 프런트 엔드에서 기본 확인을 완료하므로 JS 구현에 대한 소개가 있습니다. 가장 간단한 양식 유효성 검사. 코드 예시는 다음과 같습니다.
<!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>
위 코드는 가장 기본적인 양식 확인을 구현합니다. 즉, 양식 내용을 비워둘 수 없습니다. 다음은 구현 프로세스에 대한 간략한 소개입니다.
1. JavaScript 코드에서 chkform() 함수를 생성하여 양식을 확인합니다.
document.getElementById("username").value
위 코드는 ID가 사용자 이름인 개체의 값을 가져온 다음 if 문을 사용하여 값이 비어 있는지 확인합니다. 이 문은 매우 중요합니다. 그렇지 않으면 양식이 됩니다. 여기서는 소개하지 않는 두 번째 if 판단문도 마찬가지입니다.
2.onclick="return chkform()", 이 문의 기능은 제출 버튼을 클릭하면 chkform() 함수가 실행되어 양식을 확인한다는 것입니다. 여기서는 특히 강조합니다. 반환을 추가하는 것을 잊지 마십시오.
위 내용은 이 글의 전체 내용입니다. 모두 마음에 드셨으면 좋겠습니다.
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
