JavaScript中function 之return false的理解(实例代码)

1.司空见惯代码,在某一dom节点上注册事件方法

$("#btnResponse").click(Login);
$("#txtCode").keydown(ReturnKey);

2.非常正常的Login function,只是里面用了swal插件

代码执行效果就是我要的,点击btnResponse,当满足触发条件,弹出swal提示框,非常好.

function Login(e) {
    var loginUserId = $("#txtUserno").val(); //用户名
    var passWord = $("#txtPassword").val();  //密码
    var pCode = $("#txtCode").val();  //图形验证码
    //验证必填项
    if (loginUserId === null || loginUserId.trim() === "") {
        swal({
            title: "失败",
            text: "账号不能为空",
            type: "warning",
            showCancelButton: true,
            confirmButtonColor: "#DD6B55",
            confirmButtonText: "确定",
            closeOnConfirm: false
        });
        return false;
    }
    //略...

3.没达到预期效果的ReturnKey方法设计,弹出swal提示框立刻刷掉,看了下Login和ReturnKey的区别,无非ReturnKey又套了一层,再调用Login方法

function ReturnKey(event) {
    if (event.keyCode == 13) {
       Login();
    }
}

说明:分析上面的代码,ReturnKey在执行完成Login之后, JS的"主执行"线程没有被接管,它继续执行,所以swal被刷掉了.

4.改动代码,达到预期效果, 回车之后,swal弹出框停留在页面.

function ReturnKey(event) {
    if (event.keyCode == 13) {
       Login();
       return false;
    }
}

5.在使用sweetalert开发时,在嵌套jQueryValiate插件验证时,希望jQueryValiate弹出sweetalert窗口后,窗口不要关闭,而是停留在页面.

推测是否需要阻止JS的事件传播,不让sweetalert监听到JS事件

//如果没有这2句,sweetAlert()会捕获事件,导致弹出窗口自动关闭
event.stopPropagation();
return false;