富贵资源网 Design By www.hznty.com

前段时间学习了 HTML 和 CSS,对这方面产生了兴趣,也开始学习了 javascript 高级编程(第三版),这些天也一直在学,刚刚学到事件和表单脚本的内容。前几天,老师让编写一段代码:是在 javascript 表单中,用回车键和上下左右移动键使焦点从一个文本框移到上一个或下一个文本框中。应用目前为止学到的知识试着编写代码,在编写的过程中遇到了几个难点:取模计算;在函数内部用 this 和 arguments 找到触发事件;使用 addHandler() 方法为事件添加事件处理程序。在老师的帮助下解决了以上几个问题,自己觉得通过这段代码学到了很多知识点,所以整理完后写上注释,发表一下下。

复制代码 代码如下:
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <form>
        <div><input type="text" ></div>
        <div><input type="text" ></div>
        <div><input type="text" ></div>
        <div><input type="text" ></div>
        <div><input type="text" ></div>
        <div><input type="submit" ></div>
    </form>
    <script>
        function is_down(e) {
            var isDown;
            e = e || window.event;
            switch (e.keyCode) {
                case 13:  //回车键
                case 39:  //向右移动键
                case 40:  //向下移动键
                    isDown = true;
                    break;
                case 37:  //向左移动键
                case 38:  //向上移动键
                    isDown = false;
                    break;
            }
            return isDown;
        }
        function key_up(){
            //调用函数时,函数本身会生成 this 和 arguments
            //用 this 和 arguments 分别找到 field 和触发的事件
            var e=arguments[1];
            return is_down(e) === undefined "on" + type, handler);
            else
                element["on" + type] = handler;
        }
        var elements = document.forms[0].elements;
        for (var i = 0, len = elements.length; i < len; i++) {
            //为 keyup 事件添加 key_up 事件处理程序
            addHandler(elements[i], "keyup", key_up);
        }
    </script>
</body>
</html>

以上就是代码的全部内容了,个人感觉写的还算比较全面,该考虑到的地方都做了处理,希望大家能够喜欢。

富贵资源网 Design By www.hznty.com
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除!
富贵资源网 Design By www.hznty.com