用户登陆页面的时候，遇到了一个问题，就是要当对账户或密码进行非空验证，非空是可以检验出来，但是同时表单也提交了，送给了后台一个空表单，原来的代码是这样的
 

<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
    <form action="doLogin" method="post" id="loginForm">
        姓名：<input type="text" name="username" id="username">
        密码：<input type="text" name="pwd" id="pwd">
        <button  id="submitbut">提交</button>
    </form>
</body>
    <script type="text/javascript" src="js/jquery-1.8.3.js"></script>
    <script type="text/javascript">
        $("#submitbut").click(function(){
            var name = $.trim($("#username").val());
            
            var pwd = $.trim($("#pwd").val());
            if(name == ""){
                alert("姓名不能为空");
                return;
            }
            if(pwd == ""){
                alert("密码不能为空")
                return;
            }
            $("#loginForm").submit();
        });
        
    </script>
</html>
 

即使不填任何内容，表单也会被提交，后来把button按键换成了用div做的高仿按键或其他，都是正常的，于是就确定了问题的所在，后来查API看到button的属性：

发现button的type默认是submit，而我们在上面又没有对button的type设置，所以每次点击都会提交。
解决办法：在button里加type=“button” 即可解决
 

<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
    <form action="doLogin" method="post" id="loginForm">
        姓名：<input type="text" name="username" id="username">
        密码：<input type="text" name="pwd" id="pwd">
        <button type="button" id="submitbut">提交</button>
    </form>
</body>
    <script type="text/javascript" src="js/jquery-1.8.3.js"></script>
    <script type="text/javascript">
        $("#submitbut").click(function(){
            var name = $.trim($("#username").val());
            
            var pwd = $.trim($("#pwd").val());
            if(name == ""){
                alert("姓名不能为空");
                return;
            }
            if(pwd == ""){
                alert("密码不能为空")
                return;
            }
            $("#loginForm").submit();
        });
        
    </script>
</html>