一个页面多个input 按钮如何回车控制

项目完成了，完善也是一份重中之重的工作！至于你做的网站炫还是不炫？个人认为人性化很重要！尤其是B2C网站……如何做到项目人性化？只有不断的去发现和完善了！

购物网站已做好，目前也在新增一些新功能、SEO、及代码优化的工作！昨天运营部门同事找到我说“一般网站登录、注册填写完信息后，直接回车就可以登录或者注册了，没必要一定要单击鼠标确认啊？问我可不可以做到？” 我和他说 “不好控制。”因为之前有做过，也google了也没找到一二，但是自己没有研究下 :）（个人感觉自己js不怎么的所以就……）

还解释了下，之前的做法是这个

<body onkeydown='onEnterDown();'>

<script language='javascript'>
function onEnterDown(){
    if(window.event.keyCode == 13){
        Login();
    }
}
function Login(){
      ………………
　　………………
}
</script>

一个页面多个input 按钮，我怎么知道用户回车是想登录还是注册还是其他呢？？反问了我们的运营部同事？虽然IT这行业没做过几年，但是有个信念一直支配着我“只要能想到的代码一定能实现”。

下班回家整出来了：> 如下

例如我这个项目：

前台代码：

　　　　搜索

　　　　注册登录页面

                          <legend>会员登录</legend>
                            <div>
                                <em class="title">用户名：</em><em><input value='<%=Session["51fanli_Email"]==null?"":Session["51fanli_Email"].ToString() %>' class="input" type="text" id="loginUname" onchange="checkEmail('loginUnameErroMsg',this.value)"
                                    onblur="checkEmail('loginUnameErroMsg',this.value)" maxlength="50" /></em></div>
                            <div id="UserNameDiv" style="display: none">
                                <em class="title"></em><em id="loginUnameErroMsg"></em>
                            </div>
                            <div>
                                <em class="title">密    码：</em> <em>
                                    <input class="input" type="password" id="loginPwd" onblur="checkPwd('loginPwdErrorMsg',this.value);"
                                        maxlength="20" /></em><em></em></div>
                            <div id="PwdDiv">
                                <em class="title"></em><em id="loginPwdErrorMsg" class="status"></em>
                            </div>

　　　　　　 <div class="inner clearFix">
                        <h2>
                            密码忘记了？</h2>
                        <div>
                            请填写您注册时的Email地址，我们会将修改密码的链接发送邮件给您</div>
                        <div>
                            <input id="txtRecPwd" class="input" type="text" onchange="RetrievePassword(0)" onblur="RetrievePassword(0)"
                                value="" maxlength="50" />
                            <input id="btnRecPwd" type="button" value="发送" class="btnC1" onclick="RetrievePassword(1)" /></div>
                        <div id="RecPwdDiv">
                            <em class="title"></em><em id="RecPwdMsg" class="status"></em>
                        </div>
                    </div>

函数可以这样即可实现多个button 回车控制

$(function() {
            //搜索按钮
            $("#txtSearch").keypress(function(e) {
                var key = window.event ? e.keyCode : e.which;
                if (key.toString() == "13") {
                    search(); return false;
                }
            });

            //登录按钮LoginPwd
            $("#loginPwd").keypress(function(e) {
                var key = window.event ? e.keyCode : e.which;
                if (key.toString() == "13") {
                    Login(); return false;
                }
            });
            //密码忘记
            $("#txtRecPwd").keypress(function(e) {
                var key = window.event ? e.keyCode : e.which;
                if (key.toString() == "13") {
                    RetrievePassword(1); return false;
                }
            });
        });

就是控制用户输入的最后一个input，根据这个input事件keypress 来判断用户回车是想控制那个input按钮

这是个人的发现！可能有不足！也请群里面的大侠指点指点！有更好的方法麻烦拿出来大家分享一下呵呵 3Q……

posted @ 2011-05-20 10:57 PEPE YU 阅读(3798) 评论(20) 编辑收藏举报

刷新页面返回顶部

PEPE

一个页面多个input 按钮 如何回车控制

公告

一个页面多个input 按钮如何回车控制