title: The page will strangely refresh when I click the button
body: <p>Here's my code:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="zh-CN"&gt;
  &lt;head&gt;
      &lt;title&gt;中国工程院无线投票系统&lt;/title&gt;
      &lt;meta http-equiv="Content-Type" content="text/html;charset=utf-8"&gt;
      &lt;link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css"&gt;
      &lt;link rel="stylesheet" href="css/login.css"&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div class="container" id="login"&gt;
      &lt;div class="col-md-6 col-md-offset-3"&gt;
          &lt;div class="page-header"&gt;
              &lt;h1&gt;中国工程院无线投票系统&lt;/h1&gt;
          &lt;/div&gt;
          &lt;form&gt;
              &lt;div class="form-group"&gt;
                  &lt;label&gt;用户名&lt;/label&gt;
                  &lt;div class="input-group"&gt;
                      &lt;div class="input-group-addon"&gt;&lt;i class="glyphicon glyphicon-user"&gt;&lt;/i&gt;&lt;/div&gt;
                      &lt;input type="text" v-model="account.username" class="form-control" placeholder="Username" required
                             autofocus&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
  
              &lt;div class="form-group"&gt;
                  &lt;label&gt;密码&lt;/label&gt;
                  &lt;div class="input-group"&gt;
                      &lt;div class="input-group-addon"&gt;&lt;i class="glyphicon glyphicon-lock"&gt;&lt;/i&gt;&lt;/div&gt;
                      &lt;input type="password" v-model="account.password" class="form-control" placeholder="Password"
                             required&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
  
              &lt;button v-on:click="validate" class="btn btn-lg btn-primary btn-block"&gt;登录&lt;/button&gt;
          &lt;/form&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;script src="https://unpkg.com/vue/dist/vue.js"&gt;&lt;/script&gt;
  &lt;script src="https://unpkg.com/axios@0.12.0/dist/axios.min.js"&gt;&lt;/script&gt;
  &lt;script src="js/login.js"&gt;&lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>In the login.js file:</p>
  
  <pre><code>var login = new Vue({
      el:"#login",
      data:{account:{}},
      methods:{
          validate:function () {
  
          },
          say: function (){
  
          }
      }
  });
  </code></pre>
  
  <p>At the beginning, I thought it had something to do with the code within method "validate". However, after I deleted all the code inside, the page still get refreshed when I click the button which is not supposed to happen.</p>