• 设置网页快捷键原理(转)


    在很多网页中,可以使用快捷来完成一定的动作,比如discuz论坛的“完成后可按 Ctrl+Enter 发布”功能!

      这样的功能是用JavaScript中的event属性的KeyCode方法完成,利用onKeyDown事件进行驱动。
      在JavaScript中,可以通过keyCode属性来得到用户所按键的ASSCII码值。具体对应关系可以查ASSCII码表。
    例子:
    CODE:  [Copy to clipboard]
    <SCRIPT LANGUAGE="JavaScript">
    <!--
    function hotkey()
    {
    var a=window.event.keyCode;
    if(a==65)
    {
    alert("你按了a键吧");
    }
    }// end hotkey

    document.onkeydown = hotkey; //当onkeydown 事件发生时调用hotkey函数
    //-->
    </SCRIPT>


      另外,在快捷键的使用中,Alt、Ctrl、shift等辅助键也是经常用到的,可以通过altKey、ctrlKey、shiftKey这三个属性来判断Alt、Ctrl、shift键的状态
    比如event.ctrlKey的值为真,就说明用户按下了Ctrl键。
    例子:
    CODE:  [Copy to clipboard]
    <SCRIPT LANGUAGE="JavaScript">
    <!--
    function hotkey()
    {

    if(event.ctrlKey)
    {
    alert("你按了Ctrl键吧");
    }
    }// end hotkey

    document.onkeydown = hotkey; //当onkeydown 事件发生时调用hotkey函数
    //-->
    </SCRIPT>


      可以组合起来,形成真正的快捷键,将执行语句换为你要的效果就可以了。
    CODE:  [Copy to clipboard]
    <SCRIPT LANGUAGE="JavaScript">
    <!--
    function hotkey()
    {
    var a=window.event.keyCode;
    if((a==65)&&(event.ctrlKey))
    {
    alert("你按了ctrl+a键吧");
    }
    }// end hotkey

    document.onkeydown = hotkey; //当onkeydown 事件发生时调用hotkey函数
    //-->
    </SCRIPT>


      document.onkeydown = hotkey 语句是在全页面中,当用户按下键时,调用hotkey函数,也许你希望在页面局部实现快捷键功能,那么,你可以仿照下面这样做(记得删除"document.onkeydown = hotkey"语句):


    CODE:  [Copy to clipboard]
    <textarea rows="7" cols="90" name="message" onKeyDown="javascript: hotkey();" tabindex="2"></textarea>

      这样,只有当光标焦点在文本框中才能使用快捷键。
  • 相关阅读:
    左右对齐Justify遇到的坑
    JS中的相等性判断===, ==, Object.is()
    JS调用栈的一些总结
    VueI18n
    【转】Webpack 快速上手(下)
    【转】Webpack 快速上手(中)
    【转】Webpack 快速上手(上)
    springboot打包排除指定jar包依赖
    prometheus+grafana搭建
    fbctf 安装部署出现的问题
  • 原文地址:https://www.cnblogs.com/cuihongyu3503319/p/528976.html
Copyright © 2020-2023  润新知