阻止form空表單提交----JavaScript

網上看到很不錯的阻止form空表單提交

第一種方法

<div class="warp">
        <h2>登錄到pfan空間</h2>
        <p>這里有更多的知識分享，交流。</p>
        <form action="/register" method = "post" >
            <input type="text" name = "username" placeholder = "請輸入注冊用戶名">  <br />
            <input type="password" name = "pwd" placeholder = "請輸入初始密碼">   <br />
            <input type="password" name = "aginpwd" placeholder = "請再次輸入密碼">   <br />
            <input type="submit" value ="注冊" class="login_btn">
        </form>
    </div>
<script>
    var form = document.forms[0],
        submit = document.querySelector(".login_btn"),
        inputBtn = document.getElementsByTagName("input");
        console.log(form);
    form.onsubmit = function(){
        if(inputBtn[0].value == ""){
            alert("請您認真填寫注冊用戶名！");
            return false;
        }else if(inputBtn[1].value == ""){
            alert("請您認真輸入初始密碼！");
            return false;
        }else if(inputBtn[2].value == ""){
            alert("請您再次輸入密碼");
            return false;
        }else if(inputBtn[1].value != inputBtn[2].value){
            alert("兩次密碼輸入不匹配，請更正！");
            return false;
        }    
        
    }
</script>

　　第二種

<div class="warp">
        <h2>登錄到pfan空間</h2>
        <p>這里有更多的知識分享，交流。</p>
        <form action="/register" method = "post" >
            <input type="text" name = "username" placeholder = "請輸入注冊用戶名">  <br />
            <input type="password" name = "pwd" placeholder = "請輸入初始密碼">   <br />
            <input type="password" name = "aginpwd" placeholder = "請再次輸入密碼">   <br />
            <input type="submit" value ="注冊" class="login_btn">
        </form>
    </div>
<script>
    var form = document.forms[0],
        submit = document.querySelector(".login_btn"),
        inputBtn = document.getElementsByTagName("input");
        console.log(form);
    form.addEventListener("submit",function(e){
        if(inputBtn[0].value == ""){
            alert("請您認真填寫注冊用戶名！");
            e.preventDefault();
        }else if(inputBtn[1].value == ""){
            alert("請您認真輸入初始密碼！");
            e.preventDefault();
        }else if(inputBtn[2].value == ""){
            alert("請您再次輸入密碼");
            e.preventDefault();
        }else if(inputBtn[1].value != inputBtn[2].value){
            alert("兩次密碼輸入不匹配，請更正！");
            e.preventDefault();
        }    
    },false);

</script>

　　參考：http://www.cnblogs.com/pingfan1990/p/4655233.html