• Chrome、FireFox等标准浏览器DIV无法触发onkeydown事件


    在用HTML5的Video标签做播放器时,需要增加快捷键功能,却发现在Chrome下当按下键盘按键无法触发onkeydown事件,翻阅网上的资料有一种办法可以解决,在DIV上加入tabindex属性即可。


    示例:
    <!DOCTYPE HTML>
    <html>
    <head>
    <title>HTML5 Video</title>
    <script>
    window.onload = function () {
    var oDiv = document.getElementsByClassName('player')[0];
    oDiv.onkeydown = function (ev) {
    alert(ev.keyCode);
    };
    };
    </script>
    </head>
    <body>
    <div class="player" tabindex=0>
    <video src="video/demo.mp4"></video>
    </div>
    </body>
    </html>

    tabIndex属性可以设置键盘中的TAB键在控件中的移动顺序,即焦点的顺序。
     
    把控件的tabIndex属性设成1到32767的一个值,就可以把这个控件加入到TAB键的序列中。 
    
    这样,当浏览者使用TAB键在控件中移动时,将首先移动到具有最小tabIndex属性值的控件上,最后在具有最大tabIndex属性值的控件上结束移动。
     
    如果有两个控件的tabIndex属性相同,则以控件在代码中出现的顺序为准。
     
    默认的tabIndex属性为 0 ,将排列在在所有指定tabIndex的控件之后。 
    
    而若把tabIndex属性设为一个负值(如tabIndex="-1"),那么这个链接将被排除在TAB键的序列之外。 
    
    tabIndex的值可为0至32767之间的任意数字
  • 相关阅读:
    Oracle(二)常用操作语句
    Oracle(一)概念理解
    Spring MVC实现文件上传和下载
    Spring MVC 的执行流程
    Spring MVC原理及配置详解
    idea创建maven web项目
    Spring Bean的生命周期
    integer和int的区别
    web项目搜索框智能提示
    html-tab page
  • 原文地址:https://www.cnblogs.com/baie/p/2622822.html
Copyright © 2020-2023  润新知