Layui는 양식이 비어 있는지 확인합니다.
- 尚원래의
- 2019-07-30 16:13:096331검색
알림을 제출하려면 양식을 비워둘 수 없습니다:
관리자 시스템에서 작업할 때 백엔드에 문제가 있었습니다. 즉, 프런트엔드 양식에서 제출한 데이터를 제출할 수 없습니다. 빈 필드가 있습니다. 당시 해결책은 네이티브 js를 사용해 DOM을 조작해 판단과 팝업 작업을 수행하는 것이었습니다.
그 후 커뮤니티를 탐색하던 중 양식에 onSubmit 이벤트가 있다는 것을 발견했습니다. 이 이벤트는 양식이 제출되기 직전에 실행되는 것으로 이해할 수 있습니다. 이때 이 이벤트에 콜백 함수를 전달할 수 있습니다. 콜백 함수에서는 공백 양식 유무에 대한 확인 코드와 알림 코드가 수행됩니다.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src = "checkNull.js"></script>
</head>
<body>
//表单在进行提交的前一刻会调用onsubmit事件，这个事件会接受checkInput这个函数的返回值。
<form action="" onsubmit = "return checkInput(this)">
<input type="text" placeholder="请输入用户名">
<input type="text" placeholder="请输入密码">
<input type="submit">
</form>
</body>
</html>
<script>
function checkInput(form) {
for (let i = 0; i < form.length; i++) {
alert("进来了");
if (form.elements[i].value == "") {
alert("请您输入" + form.elements[i].placeholder);
form.elements.onfocus();
//这里返回一个Boolean值，从而确定表单是否能够提交
return false;
}
}
}
</script>추천: layui 프레임워크 튜토리얼
위 내용은 Layui는 양식이 비어 있는지 확인합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
이전 기사：Layui와 백엔드를 연결하는 방법다음 기사：Layui와 백엔드를 연결하는 방법