简单Demo的用户登录JSP界面IE、Firefox（chrome） Enter 键提交表单

<%@ page language="java" contentType="text/html; charset=UTF-8"

    pageEncoding="UTF-8"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>系统登录</title>

<%@ include file="/common/taglibs.jsp"%>

<script type="text/javascript">

    function validateUserInfo() {

        var username = document.getElementById("username").value;

        var password = document.getElementById("password").value;

        if (!username) {

            alert("请输入账号！");

        } else if (!password) {

            alert("请输入密码！");

        } else {

            if (username == "admin" && password == "admin2014") {

                document.getElementById("frm").submit();

            } else {

                alert("账号或密码错误！");

                cancle();

            }

        }

    }

    //取消操作

    function cancle() {

        document.getElementById("username").value = "";

        document.getElementById("password").value = "";

        document.getElementById("username").focus();

    }

    //回车提交表单，这两种方案在chrome下执行正常

    if (document.addEventListener) {//如果是Firefox

        document.addEventListener("keypress", fireFoxHandler, true);

    } else {

        document.attachEvent("onkeypress", ieHandler);

    }

    function fireFoxHandler(evt) {

        //alert("firefox");

        if (evt.which == 13) {

            validateUserInfo();

        }

    }

    function ieHandler(evt) {

        //alert("IE");

        if (evt.keyCode == 13) {

            validateUserInfo();

        }

    }

</script>

</head>

</head>

<body class="easyui-layout" style="background-color: #C3DDF4;">

    <center>

        <div style="padding-top: 50px; background-color: white;">

            <div>

                <img alt="logo" src="res/images/logo.jpg">

            </div>

            <label style="font-family: '微软雅黑'; font-size: 28px;">川庆钻探工程有限公司地球物理勘探公司山地数字地震队管理系统</label>

            <form id="frm" action="${ctx}/login" method="post">

                <table

                    style="border: 1px solid; border-color: white; width: 270px; padding: 20px;">

                    <tr>

                        <th>账号：</th>

                        <td><input id="username" name="username" type="text"/></td>

                        <td></td>

                    </tr>

                    <tr>

                        <th>密码：</th>

                        <td><input id="password" name="password" type="password"/></td>

                        <td></td>

                    </tr>

                    <tr>

                        <td></td>

                        <td><input type="button" value="登录"

                            onclick="validateUserInfo()" />&nbsp;&nbsp; <input type="button"

                            value="取消" onclick=" cancle()" /></td>

                        <td></td>

                    </tr>

                </table>

            </form>

        </div>

    </center>

    <center>

        <div style="bottom: 30px; padding-left: 35%;; position: absolute;">

            <center>Copyright &copy; 2013 - 2014 川庆钻探工程有限公司地球物理勘探公司</center>

        </div>

    </center>

</body>

</html>
巴特西

简单Demo的用户登录JSP界面IE、Firefox（chrome） Enter 键提交表单

最新文章

热门文章
