程序员经验分享-hwhale

在 Javascript 中捕获 onkeydown

2023-12-03

I have a web front-end to an AS/400 CGI application which allows the use of some of the F1-F24 keys (depending on the page) as well as page-up, page-down etc - these are passed to the underlying application which handles them appropriately. For instance, on a given page, a user could either press the F3 button or press the F3 key - both of them will set the (hidden) CmdKey variable to have a name of '_K03' and a value of 'F03'. The button handling is simple and has no problems. To handle users pressing an actual F-key on the keyboard, I have had an IE-compatible script for a long time which works perfectly:

function setCmdKeyIE() {                                                        
  var cmdkeycode = "";                                                          
  if (window.event.keyCode != 13 &
    window.event.keyCode != 33 &                 
    window.event.keyCode != 34 &
    window.event.keyCode < 112 ) return;         
  window.event.keyCode = window.event.keyCode + 1000;                           
  if (window.event.shiftKey) window.event.keyCode = window.event.keyCode + 1000;
  switch(window.event.keyCode) {                                                
    case 1013: cmdkeycode = "EN"; break; /* Enter */                            
    case 1033: cmdkeycode = "UP"; break; /* Page Up */                          
    case 1034: cmdkeycode = "DN"; break; /* Page Down  */                       
    case 1112: cmdkeycode = "01"; break; /* F1 */                               
    case 1113: cmdkeycode = "02"; break; /* F2 */                               
    ...(F3 thru F24 here)...
    default:   return;                   /* Anything else should be ignored */
  }                                                         
  window.event.cancelBubble = true;                         
  window.event.returnValue = false;                         
  document.forms[0].CmdKey.value = "F" + cmdkeycode;        
  document.forms[0].CmdKey.name = "_K" + cmdkeycode;        
  if (ONSUBMITFUN() == true) document.forms[0].submit();    
}

这不仅正确设置了 CmdKey 元素，而且还覆盖（停止）执行浏览器默认行为（如果有）（例如，当用户按 F3 时，不会出现搜索框）。

The setCmdKeyIE()函数被这样调用：

<body onKeyDown="setCmdKeyIE();" onHelp="return false;">

我现在需要它适用于 Firefox（以及可能的其他浏览器），但我遇到了各种各样的麻烦。我最初更改了 setCmdKeyIE 函数（是的，我知道一旦它不再特定于 IE，就应该更改名称，但这是我最不担心的！）以获取事件作为参数（这只适用于 Firefox，我想）或者如果没有通过（使用 IE）则使用当前行为。我还添加了一些其他处理来停止 Firefox 事件传播，但它不起作用......

这是新的无效代码 - 有好心人可以指出我的方法的错误吗？

function setCmdKey(e) {
  if (!e) {
    var e = window.event; /* IE event-handling */
  }
  var wrkkeyCode = e.keyCode;
  if (wrkkeyCode != 13 &
      wrkkeyCode != 33 &
      wrkkeyCode != 34 &
      wrkkeyCode != 27 &
      wrkkeyCode < 112 ) return;
  wrkkeyCode = wrkkeyCode + 1000;
  if (e.shiftKey) wrkkeyCode = wrkkeyCode + 1000;
  var cmdkeycode = "";
  switch(wrkkeyCode) {
    case 1013: cmdkeycode = "EN"; break; /* Enter */
    case 1033: cmdkeycode = "UP"; break; /* Page Up */
    case 1034: cmdkeycode = "DN"; break; /* Page Down  */
    case 1112: cmdkeycode = "01"; break; /* F1 */
    case 1113: cmdkeycode = "02"; break; /* F2 */
    ...(F3 thru F24 here)...
    default:   return;               /* Anything else should be ignored */
  }
  if (e.stopPropagation) {           /* FF */
    e.stopPropagation();
    e.preventDefault();
  }
  else {                             /* IE */
    e.cancelBubble = true;
    e.returnValue = false;
  }
  document.forms[0].CmdKey.value = "F" + cmdkeycode;
  document.forms[0].CmdKey.name = "_K" + cmdkeycode;
  if (ONSUBMITFUN() == true) document.forms[0].submit();
}

我需要使用 Firefox 从 setCmdKeyIE 返回 false 吗？即使此过程返回 false，这也成立吗？


UPDATED

我现在已经解决了这个问题。抱歉删除了下面评论的上下文，但是嘿，以前的版本仍然存在。

事实证明，IE 中有两个问题需要修复：第一个是与我之前所说的相反，放置一个onkeydown属性中的<body>不起作用。您需要将其附加到文档中。第二个问题是，IE 不会让您抑制魔法行为，例如由 F3 键触发的搜索对话框，除非您进行了涉及更改keydown事件keyCode财产，这显然是一件非常错误的事情。不管怎样，删除onkeydown属性中的<body>以下应该可以完成这项工作（现在已修改为也可以在 Opera 中工作）：

var keyCodeMap = {
    "1013": "EN",
    "1033": "UP",
    "1034": "DN",
    "1112": "01",
    "1113": "02",
    "1114": "03"
    // ...(F4 thru F24 here)...
};

var suppressKeypress = false;

function setCmdKey(e) {
    e = e || window.event;
    var wrkkeyCode = e.keyCode;
    if (wrkkeyCode != 13 &&
        wrkkeyCode != 33 &&
        wrkkeyCode != 34 &&
        wrkkeyCode != 27 &&
        wrkkeyCode < 112) return;

    wrkkeyCode += 1000;

    if (e.shiftKey) wrkkeyCode += 1000;
    var cmdkeycode = keyCodeMap[wrkkeyCode];
    if (!cmdkeycode) return; /* Anything else should be ignored */

    var input = document.forms[0].elements["CmdKey"];
    input.value = "F" + cmdkeycode;
    input.name = "_K" + cmdkeycode;

    try {
        // Prevent default action in IE by bad hacky means
        e.keyCode = 0;
    } catch (ex) {
        // Other browsers do not allow setting the keyCode
    }
    suppressKeypress = true;

    if (ONSUBMITFUN()) document.forms[0].submit();
    return false;
}

document.onkeydown = setCmdKey;
document.onkeypress = function() {
    if (suppressKeypress) {
        return false;
    }
};
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

javascript

crossbrowser

domevents

ibmmidrange

onKeyDown

在 Javascript 中捕获 onkeydown 的相关文章

  • 如何从 JavaScript 中的字符串中删除空白字符？

    如何从 JavaScript 中的字符串中删除空白字符 修剪很容易 但我不知道如何将它们从inside字符串 例如 222 334 gt 222334 您可以使用正则表达式 如下所示来替换所有空格 var oldString 222 334

  • 将 R (ramda) 导入 typescript .ts 文件

    我正在尝试使用Ramda js如下

  • 如何设置上传的文件名？

    By using multer I made it to request image file like this 这个文件存储在我设置的 上传 文件夹中 我的代码如下 var multer require multer var uploa

  • Crypto-Js 库的 hmac-256 脚本返回函数结构而不是 Google Apps 脚本中的值，在外部工作正常吗？

    我正在设置一个谷歌电子表格项目来连接到我的 CryptoExchange API 但是当涉及到这个简单的 CryptoJs Hmac sha256 脚本时 它不起作用 它返回函数结构而不是值 而在外部它工作正常 看我的jsfiddle ht

  • 实现悬停信息框

    我有一个日历 当用户将鼠标悬停在单元格上时 会出现一个很大的信息框 其中包含该日期的详细信息 虽然当用户离开时使信息框消失 但我遇到了一些麻烦 我基本上想要它 这样当鼠标光标移出信息框隐藏的日历单元格时 它就会消失 但我遇到了麻烦 因为mo

  • Javascript 在另一个函数中检测“Shift”键按下

    我正在从 Flash 影片 使用外部接口 调用我的 html 页面中的 Javascript 函数 并且我想知道调用该函数时用户是否按下了 Shift 键 例如 如果我通过鼠标单击调用该函数 这似乎很简单 因为我可以传递事件并检查 if e

  • 无法读取未定义的“触及”属性

    为什么我会收到此错误无法读取未定义的属性 为什么无法读取formName controls email touched但它能够阅读formName get custDetails touched

  • 递归修剪对象中所有元素的更好方法？

    如果我有一个像这样的物体 const obj field subfield innerObj a asdasd asdas innerArr s ssad innerArrObj b adsad 我想出了这样的东西 const trimFi

  • React 应用程序中的 addEventListener 不起作用

    一些背景 我正在尝试消费自定义网络组件在 React 应用程序中并尝试监听来自 Web 组件的事件 我相信您不能只在自定义 Web 组件上以通常的反应方式处理事件 i e

  • 如何在php中使用一张图像绘制形状

    我需要使用图像的一部分来创建帧图像 例如 用户将从后端上传图像片段 现在我需要根据前端用户的要求在前端创建一个框架 用户将选择框架的高度和宽度 然后他将选择该图像片段 如下所示 我没有办法做到这一点 我尝试通过 css 和 html can

  • 将异步事件监听器与 Nestjs EventEmitter 模块和无服务器函数结合使用

    我正在尝试在 Nestjs EventEmitter 模块的帮助下实现具有无服务器 lambda 函数的异步工作线程 处理程序在发出事件时被调用 但该函数在 async await 调用之前关闭 我尝试过同时使用emit and emitA

  • 窗口大小调整触发的 DOM 事件

    我有一个布局相当复杂的页面 最初打开页面时 某些元素的对齐存在问题 但是 可以通过更改浏览器窗口的大小来 永久 解决此问题 显然 我不希望用户必须调整浏览器窗口的大小才能使页面正确显示 所以我想知道是否有一种方法可以在页面首次加载时以编程方

  • 类型“void”不可分配给类型“((event:MouseEvent) => void) |不明确的'

    import as React from react import App css import PageTwo from components PageTwo export interface IPropsk data Array

  • 自定义指令链接中的 element.replaceWith 仅在第一次调用时有效

    我是 Angularjs 的新手 不太了解幕后的情况 基本上我想创建一个 E 扭结指令 基于控制器中的数据 我动态创建html 就像整个 表 一样 以替换该指令 我的 html 文件中的指令是这样的

  • JavaScript Promise 不执行 .then()

    我在 JavaScript 中的 Promise 方面遇到了一些问题 我想做的是获得一个地址列表 然后对于每个地址 我需要调用地理编码 API 来获取 lat lng 然后我将继续将标记与热图一起绘制 这是我的代码 let promiseK

  • 如何使用 JavaScript 获取元素的填充值？

    我有一个textarea在我的 HTML 中 我需要获取整数或浮点形式的填充数值 以像素为单位 我如何使用 JavaScript 获取它 我没有使用 jQuery 所以我正在寻找纯 JavaScript 解决方案 这将返回padding l

  • 不使用控件时，视频元素在 Chrome 中消失

    So I think这是一个浏览器错误 它出现在一个更复杂的设计 网站中 但我已经进行了很好的尝试 简化了我的代码和设计等 并发现了以下内容 嵌入时

  • Javascript onload 不起作用[关闭]

    这个问题不太可能对任何未来的访客有帮助 它只与一个较小的地理区域 一个特定的时间点或一个非常狭窄的情况相关 通常不适用于全世界的互联网受众 为了帮助使这个问题更广泛地适用 访问帮助中心 help reopen questions 我正在使用

  • 使用 AJAX 和 JQuery 按设定的时间间隔刷新 Rails 部分

    I have a page in my rails application that looks like 现在 我有另一个用 python 编码的人工智能应用程序 它处理视频 显示在 Rails 应用程序页面的左侧 并使用捕获的车辆及其相

  • 在方法内部执行方法

    我目前正在 FreeCodeCamp 中进行 JavaScript 练习 我的代码应该使用的测试用例之一是函数调用 如下所示 addTogether 2 3 这是我得到的基本功能 function addTogether return 当我

随机推荐

  • 如何通过代码打开多个网址，我们有一个代码，但它只适用于一个网址

    我们有以下脚本 我们正在谷歌脚本编辑器中运行它 它工作正常 但它只打开一个网址 如果我们想打开多个网址 我们该怎么做 函数是 function myFunction var js var html HtmlService createHtm

  • 设置打印机首选项 - 页面方向为横向

    我想将页面方向设置为 LandScape 以便从我的 excel Vsto 项目打印 excel 工作表 手动设置页面方向打印机首选项从 打印 表单弹出的窗口 我需要一些自动化 每次用户发出打印命令时都会将方向设置为景观 我注意到如果我将方

  • 从数据存储区读取（跨组）实体时发生 TransactionFailedError（争用过多...）

    我再次调查意外发生的情况TransactionFailedError too much contention on these datastore entities 在某些情况下 代码仅读取因争用问题而被归咎的实体组 Setup GAE 标

  • C 中语句 z=++x||++y&&++z 的运算符优先级

    我正在研究运算符优先级 但我无法理解x became 2以及y and z is 1 x y z 1 z x y z 这评估为 x 2 y 1 z 1 优先级高于 因此分配的整个 RHS 归结为增量x以及对真值的评估 1 z x y z t

  • 正则表达式从字符串中获取日期

    我需要一个正则表达式来从以下字符串中获取日期 anything 2011 01 17 16 50 19 xml 这是正确的吗 0 9 0 9 xml 这里检查格式 YYYY MM DD HH MM SS d 4 d 2 2 d 2 d 2

  • Selenium/python - 无法找到部分链接文本

    在 Windows 10 上运行 Chrome 驱动程序 作为脚本和来自 python REPL 的带有 Python 2 7 的 Selenium 无法通过部分链接文本找到元素 我不确定为什么 当我查看相关网页的源代码时 只有一个实例WO

  • 我可以仅在周围没有文字时选择 吗？

    我想仅在锚标记完全独立时才选择它们 这样我可以使它们看起来像按钮 而不会使句子中的锚看起来像按钮 我不想添加额外的类 因为这是在 CMS 中进行的 我最初是在尝试这个 article p a first child last child b

  • POST请求神秘地变成了GET请求

    我有一个带有 unicorn 和 nginx 的 Rails 4 1 应用程序 但不知何故 神秘的是我的 POST 请求变成了 GET 请求 这是请求标头 Remote Address lt

  • 在 Swift 中将 JSON 字符串转换为对象的简单而干净的方法

    我花了几天时间寻找如何将一个相当简单的 JSON 字符串转换为 Swift 中的对象类型 但没有成功 以下是 Web 服务调用的代码 func GetAllBusiness Alamofire request GET http MyWebS

  • 如何将变量传递到bitbucket-pipelines中的credentials.json？

    我正在使用 bbrun 来模拟本地运行的管道 本质上 我需要的 不是问题 是在 GCP 上自动执行 terragrunt 基础设施部署 因此 每次使用标签推送时 它都会部署特定的环境 这是我的 bitbucket pipelines yml

  • Python 生成器和迭代器的区别

    迭代器和生成器有什么区别 一些关于何时使用每种情况的示例会很有帮助 iterator是一个更一般的概念 任何其类具有 next 方法 next在Python 2 和 iter 的方法return self 每个生成器都是一个迭代器 但反之则

  • “setInterval”内“for”的索引

    我有一个对象 我把它放在一个数组中 然后我用for对于数组中的每个对象 我设置了一个设置的间隔 用于使用参数调用对象的方法 但我不能 这是我的 班级 function ClassTest this test function word co

  • GWT 主题样式覆盖我的 css 样式

    我有一些带有自己的 css 的 html 文件 我想在 gwt 应用程序中使用它们 因此我复制了应用程序中的 html 和 css 文件 问题是当我打开 html 时它使用 gwt 主题样式 例如 在我的 css 中 html body 背

  • 确定程序集的框架 (CLR) 版本

    从命令行 或通过任何方式 我如何确定哪个CLR版本a NET组装需要 我需要确定程序集是否需要 2 0 或 4 0 CLR 版本 ildasm exe如果您双击 MANIFEST 并查找 元数据版本 将会显示它 默认情况下 它是编译映像所针

  • MySQL LIKE 与 json_extract

    我有一个 MySQL 查询 其中按 json 字段进行过滤 SELECT id username FROM SELECT id Json extract payload username AS username FROM table1 AS

  • 空手道：当在后台定义 json 时，动态场景大纲不起作用

    Feature Dynamic Scenario Outline Background def kittens name abc name def Scenario Outline cat name

  • 在 Java 中：如何从 byte[] 数组中压缩文件？

    我的应用程序通过 SMTP 服务器接收电子邮件 电子邮件中有一个或多个附件 电子邮件附件以 byte 形式返回 使用 sun javamail api 我试图即时压缩附件文件 而不先将它们写入磁盘 实现这一结果的可能方法是什么 您可以使用

  • 如何检测FMX列表视图何时滚动到底部？

    我正在开发 FiremonkeyTListView显示搜索结果 此列表一次加载 25 个项目 但可能会显示数百个项目 我需要检测用户何时向下滚动到底部 以便我可以获取接下来的 25 个项目以显示在列表中 但是 我找不到合适的属性来确定这一点

  • 从 NumPy 2D 数组中删除重复的列和行

    我使用二维形状数组来存储经度 纬度对 在某一时刻 我必须合并其中两个二维数组 然后删除任何重复的条目 我一直在寻找类似于 numpy unique 的函数 但我没有运气 我曾经做过的任何实施 思考看起来非常 未优化 例如 我尝试将数组转换为

  • 在 Javascript 中捕获 onkeydown

    I have a web front end to an AS 400 CGI application which allows the use of some of the F1 F24 keys depending on the pag

热门标签