函数反复运行Jquery

Question

我有一个愚蠢的简单Jquery .js文件,我正在忙着创建,我在第一步陷入困境.

我目前设置如下所示,但每次单击页面上的唯一按钮(登录页面的提交按钮)时,它会重新加载整个页面并再次运行第一个功能.

我怎么让这个功能只运行一次

$(document).ready(function() {
    //
    //  FUNCTIONS 
    //

    function AllFade() {
        //Hide everything
        $('div').hide()

        //Fade Everything in
        $('div').fadeIn(1000);

        //Hide All Alerts
        $('.alert').hide();
    }

    function LoginCheck() {
        //Check username and pass
    }   

    //   EVENTS     

    //START SEQUENCE
    AllFade();

    //Login check on submit
    $('.btn').click(function() {
        LoginCheck();
    })
});

!编辑 !!

按钮的编码就是:

<button class="btn btn-large btn-primary">Sign in</button>

那会不会导致重装？

Answer 1

您需要阻止表单的提交(事件),.preventDefault()因此它不会执行默认行为:提交表单并重新加载页面.

$('.btn.btn-large.btn-primary').click(function(event) { 
   //if only button on page you can have just $('button')
    event.preventDefault()
    LoginCheck();
})

type="button"如果您不想使用button提交按钮,也可以添加,因为button元素具有默认类型的提交:

<button type="button" class="btn btn-large btn-primary">Sign in</button>

你可以在这里阅读更多:

jQuery文档:.preventDefaul()