Layui는 양식이 비어 있는지 확인합니다.-레이이 튜토리얼-php.cn

Layui는 양식이 비어 있는지 확인합니다.

尚

풀어 주다： 2019-07-31 08:59:28

원래의

6339명이 탐색했습니다.

Layui는 양식이 비어 있는지 확인합니다.

알림을 제출하려면 양식을 비워둘 수 없습니다:

관리자 시스템에서 작업할 때 백엔드에 문제가 있었습니다. 즉, 프런트엔드 양식에서 제출한 데이터를 제출할 수 없습니다. 빈 필드가 있습니다. 당시 해결책은 네이티브 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 중국어 웹사이트의 기타 관련 기사를 참조하세요!