现在的位置: 首页 > 综合 > 正文

asp.net 各浏览器下实现回车提交表单

2013年10月06日 ⁄ 综合 ⁄ 共 1616字 ⁄ 字号 评论关闭

在做登录页面的时候,有客户提出,希望在输入上一个信息后,回车自动跳转到下一个输入框,

比如输入用户名后回车跳到密码框,输入密码后再回车即提交表单,

本来是一个很简单的事情,但是一碰到各种浏览器就变得复杂了。

天啊,什么时候天下浏览器都同一个标准啊。。。

 

在实现过程中,碰到两个问题,

首先是不同浏览器对按键的捕捉问题;

第二个是不同浏览器对控件 click 事件提交的支持不一样,如火狐等不支持JS触发click事件提交。解决方法是调用asp.net的 __doPostBack('lkb_login', '') 方法提交表单。

 

最后实现如下:

 

        var Sys = {};
        var ua = navigator.userAgent.toLowerCase();
        if (window.ActiveXObject)
            Sys.ie = true;
        else if (ua.indexOf("chrome") != -1)
            Sys.chrome = true;
        else if (ua.indexOf("firefox") != -1)
            Sys.firefox = true;

        function EnterClick(e) {
            var code;
            if (!e) {
                var e = window.event;
            }
            if (e.keyCode) {
                code = e.keyCode;
            }
            else if (e.which) {
                code = e.which;
            }
            if (code == 13) {
                var sender = e.target || e.srcElement;
                if (!!sender && sender.id == "lkb_login")
                    return true;
                if (Trim(document.getElementById("txt_username").value) == "请输入昵称/Email/手机" || Trim(document.getElementById("txt_username").value) == "请输入会员卡号") {
                    document.getElementById("txt_username").value = "";
                    document.getElementById("txt_username").select();
                } else if (Trim(document.getElementById("txt_username").value) == "") {
                    document.getElementById("txt_username").value = "";
                    document.getElementById("txt_username").select();
                } else if (Trim(document.getElementById("txt_pwd").value) == "") {
                    document.getElementById("txt_pwd").focus();
                } else {
                    //2012.11.06 回车提交
                    //                    if (window.ActiveXObject)
                    //                        document.getElementById("lkb_login").click();
                    //                    else
                    //                        document.getElementById("lkb_login").focus();
                    document.getElementById("imgLogin").style.display = "none";
                    document.getElementById("div_login_tip").style.display = "block";
                    __doPostBack('lkb_login', '');
                }
                return false;
            }
            return true;
        }
        if (Sys.ie || Sys.chrome) {
            document.onkeydown = function(e) {
                return EnterClick(e);
            }
        } else {
            document.onkeypress = function(e) {
                return EnterClick(e);
            }
        }

抱歉!评论已关闭.