jquery无法移出元素（form表单自动刷新）

本文链接：https://blog.csdn.net/fengsigaoju/article/details/53079484

今天遇到一个坑，想判断用户输入成功后使用jquery移出元素，但是失效，后来发现因为提交成功后 form表单自动刷新

1.html

 <!DOCTYPE html>  
    <html lang="en">  
    <head>  
        <meta charset="UTF-8">  
        <title>Login</title>  
         <link rel="stylesheet" type="text/css" href="Login.css"/>  
        <script src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script>
        <script src=".js"></script>   
    </head>  
    <body>  
        <div id="login">  
            <h1>first</h1> 
           <form method="post" onSubmit="return check(this);">  
                <input type="text" required="required" placeholder="考试密码" name="first"></input>
                <button class="but" type="submit">参与考试</button> </form>  
        </div>
    </body>  
    </html>

first.js

function check(){
 if (form.first.value=="123456"){
  $("#login").fadeOut();//让login移除
  return true;
   }
   return false;
}

解决办法是去掉form标签，直接一个框子一个按钮，就可以了

2.html

 <!DOCTYPE html>  
    <html lang="en">  
    <head>  
        <meta charset="UTF-8">  
        <title>Login</title>  
         <link rel="stylesheet" type="text/css" href="Login.css"/>  
        <script src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script>
        <script src="check2.js"></script>   
    </head>  
    <body>  
        <div id="login">  
            <h1>first</h1> 
            <input type="text" required="required" placeholder="考试密码" name="first" id="mytext"></input>
            <button class="but" type="submit" οnclick="check2()">参与考试</button> 
        </div>
    </body>  
    </html>

check2.js

function check2(){
 if (document.getElementById("mytext").value=="123456"){
  $("#login").fadeOut();//让login移除
  }
  else{
  	document.getElementById("mytext").value="";
   }
 }