a 標籤提交前驗證

時間 2019-12-07

標籤標籤提交驗證简体版

原文原文鏈接

最近在作驗證的時候遇到了submit()與onsubmit()事件衝突的問題，原本想在a標籤中添加submit()進行表單的提交，而後在 form中添加onsubmit事件觸發驗證方法。結果行不通，最後只能選擇在java script中進行表單的提交。方案以下：javascript

設置form頭部以下：添加id是爲了在java script腳本中進行中獲取form對象html

<form method="post" action="AdminServlet" id="Loginform" >

在a標籤中添加onClick()事件，觸發java script表單驗證的方法loginLayoutValidate()java

<a href="javascript:void(0)"   onClick="loginLayoutValidate()"/>

    function loginLayoutValidate(){  
        var userName=document.getElementById("userName");  
        var passWord= document.getElementById("passWord");  
        var validateCode=document.getElementById("validateCode");  
        if(userName.value.trim()==""){  
            alert("用戶名不能爲空");  
            return ;  
        }  
        else if(passWord.value.trim()==""){  
            alert("密碼不能爲空");  
            return ;  
        }  
        else if(validateCode.value.trim()==""){       
            alert("請輸入驗證碼");  
            return ;  
        }  
        else{  
                document.getElementById("Loginform").submit();  
        }     
    }

例子:post

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script>
    function submitcheck() {
        if (document.getElementById('name').value == '') {
            alert('必須輸入網站名！');
            document.getElementById('name').focus();
            return false;
        } else if (document.getElementById('ftp_url').value == '') {
            alert('必須輸入Ftp地址！');
            document.getElementById('ftp_url').focus();
            return false;
        } else {
            document.getElementById('fm_1').submit();
        }
    }
    </script>
</head>

<body>
    <form action="#" id="fm_1" name="fm_1">
        <input type="text" id="name" name="name" required="required">*
        <br>
        <input type="text" id="ftp_url" name="ftp_url">*
        <br>
        <input type="submit" value="提交">
        <br>
        <input type="reset" value="重置">
        <br>
        <a href="javascript:void(0)" onclick="checkform()">提交</a>
        <br><a href="#" onclick="document.fm_1.reset()">重置</a>
    </form>
</body>

</html>

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。