zoukankan      html  css  js  c++  java
  • 键盘事件(在输入框中输入内容后按回车键)

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

    <html xmlns="http://www.w3.org/1999/xhtml" lang="en">

        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
            <title>登录直接按回车的效果</title>
            <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
            <script type="text/javascript">
                $(function() {
                    $("input[type='text']:eq(0)").keyup(
                        function() {
                            if(event.keyCode == 13) {
                                $("input[type='password']:eq(0)").focus();
                            }
                        }
                    );

                    $("input[type='password']:eq(0)").keyup(
                        function() {
                            if(event.keyCode == 13) {
                                $("input[type='button']:eq(0)").click();
                            }
                        }
                    );

                    $("input[type='button']:eq(0)").click(
                        function() {
                            var result = "";
                            result += "账户是:" + $("input[type='text']:eq(0)").val();
                            result += " ";
                            result += "密码是:" + $("input[type='password']:eq(0)").val();

                            alert(result);
                        }
                    );

                    //屏蔽默认的浏览器右键菜单
                    $(document).bind("contextmenu", function(e) {
                        return false;
                    });

                    //绑定自定义右键菜单
                    $(document).mouseup(
                        function() {
                            console.debug("Button:" + event.button);
                            if(event.button == 2) {
                                $("div")
                                    .css("left", event.x)
                                    .css("top", event.y)
                                    .show();
                            }
                        }
                    );
                });
            </script>
        </head>

        <body>
            <table border="0">
                <tr>
                    <th>账户:</th>
                    <td>
                        <input type="text" />
                    </td>
                </tr>
                <tr>
                    <th>密码:</th>
                    <td>
                        <input type="password" />
                    </td>
                </tr>
                <tr>
                    <td colspan="2" align="center">
                        <input type="button" value="登录" />
                    </td>
                </tr>
            </table>
            <div style="border: solid blue 1px; 200px; height: 400px; display: none; position: absolute;">

            </div>
        </body>

    </html>

  • 相关阅读:
    验证SMTP工作过程
    FileZilla FTP服务器的安装和配置
    最后一块石头的重量
    不用加号的加法
    同构字符串
    最长公共子序列
    Telnet 验证HTTP工作过程
    矩阵的最小路径和
    子数组的最大累加和问题
    海思开发板——YOLOv3模型移植(4)
  • 原文地址:https://www.cnblogs.com/zhouguoshuai/p/8192191.html
Copyright © 2011-2022 走看看