The page will strangely refresh when I click the button : <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>
