keydown 事件中的输入验证

2024-01-04

我正在尝试在以下过程中对用户文本输入进行信息验证keydown事件。我试图验证的原因是keydown事件是因为我不想显示那些被认为是非法的字符input开头的盒子。

我写的验证是这样的,

function validateUserInput(){
   var code = this.event.keyCode;
    if ((code<48||code>57) // numerical
      &&code!==46 //delete
      &&code!==8  //back space
      &&code!==37 // <- arrow 
      &&code!==39) // -> arrow
   {
     this.event.preventDefault();        
    }
}

我可以继续这样,但是我看到了这种实现的缺点。例如,这些是:

  1. 当我输入更多的条件来检查时,条件语句变得越来越长。
  2. keyCodes不同浏览器可能会有所不同。
  3. I have to not only check what is not legal but also have to check what are exceptional. In above examples, delete, backspace, and arrow keys are exceptional.

但我不想失去的功能是不显示输入textarea除非通过验证。 (如果用户尝试在其中输入非法字符textarea,什么都不应该出现)这就是为什么我不进行验证keyup event.

所以我的问题是:

  1. 有没有更好的方法来验证输入keydown事件而不是检查keyCode by keyCode?
  2. 除了捕获用户输入之外还有其他方法吗keydown浏览器显示之前发生的事件?以及一种对其进行验证的方法?

如果您正在检查可打印的密钥(这正是您似乎正在做的事情),您应该使用keypress相反,因为这是您能够获得有关按键所代表的字符的可靠信息的唯一地方。您无法可靠地检测数字按键keydown事件。此外,抑制箭头键和删除/退格键也是一个坏主意。这样做你能得到什么?

还有一些错误:在 Firefox 中,您需要获取Event传递到事件处理函数的参数中的对象,如果您使用的是 DOM0 事件处理函数而不是addEventListener() or attachEvent(),你应该使用return false;抑制默认行为。这是我推荐的代码:

var input = document.getElementById("your_input_id");

input.onkeypress = function(evt) {
    evt = evt || window.event;
    var charCode = evt.which || evt.keyCode;
    var charStr = String.fromCharCode(charCode);
    if (/\d/.test(charStr)) {
        return false;
    }
};
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

keydown 事件中的输入验证 的相关文章

随机推荐

  • 无法更改 Unity 中 Inspector 变量中的数组大小?

    根据我读到的内容 这就是矢量 大小 的设置方式 public Color teamAColors new Color 4 But when the code is run it looks like this 我为 4 设置的数字似乎并不重
  • 为什么 Rails 命令强制显示“new”命令的帮助消息?

    奇怪的是 在某些情况下我无法执行典型的 Rails 命令 例如rails s and rails c 我发现这种情况发生在某个功能分支上 过去也偶尔发生过 但目前适用于我的develop branch 我逆转了任何 rb可以加载并产生任何效
  • 具有多个数据库的 Rails RSpec

    我运行一个 Rails 应用程序 我们正在将注册流程拆分为一个单独的应用程序 注册应用程序有自己独立的数据库 用于 CMS 和收集潜在客户 但它还需要访问主数据库 使用这个效果非常好ActiveRecord Base establish c
  • gob 恐慌解码接口

    我有一个带有未导出字段的结构 应该对其进行 gob 编码和解码 Say type A struct s int func a A Inc a s 显然在这种情况下我需要实施gob GobEncoder and gob GobDecoder接
  • 动画 gif 无法播放 - 鼠标侦听器 - 鼠标输入事件

    我有一个按钮 我已将其替换为图像 悬停时我希望该图像播放动画 gif 我添加了一个鼠标监听器并输入了将图像更改为 gif 的代码 图像变为gif 然而 gif 并没有动画 我在这个网站上查找过以前的答案 很少但没有一个能够提供帮助 Over
  • 如何在 VS Code 中禁用 C++ 错误检查?

    我正在生成 C 示例代码文件 因此它们有很多固有错误 例如虚构的函数名称 我正在尝试删除文件中的所有错误消息和与错误相关的语法突出显示 我想 C 有一些设置 但我找不到它 打开命令面板 CTRL SHIFT P gt C Cpp 切换错误曲
  • 有没有办法在MonoTouch中制作原生的cocoa类库?

    我知道 MonoTouch 将代码编译为本机机器代码 有没有办法使用 MonoTouch 制作一个本机 a 类库 需要明确的是 我不想在两者之间共享代码 因为我知道这是不可能的 我相信这是可能的 但这将是一项艰苦的工作 而且离收缩包装的开箱
  • FragmentStatePagerAdapter 从 API 27 开始已弃用

    FragmentStatePagerAdapter从 API 27 开始已弃用 替代方案是什么FragmentStatePagerAdapter private class MainPagerAdapter extends Fragment
  • “在上下文或道具中找不到“store””我在尝试简单的react-redux代码时收到此错误

    这是我的书单容器 import React Component from react import connect from react redux class BookList extends Component renderList r
  • 在哪里放置 Windows 窗体项目的中央错误处理程序

    在 ASP NET 中我可以使用Application Error在 global asax 中 以便处理任何未处理的错误 Windows 窗体中有等效的吗 是的 它的 AppDomain UnhandledException using
  • 将 Web 服务添加到已有的 Java 项目中

    我是 Java 新手 我有一个Java项目 它在我的 Windows 7 机器上完美运行 我想将该项目的一些功能用作 Web 服务 以便能够在我的 Silverlight 应用程序中使用它们 Silverlight 应用程序和这个 Java
  • Swift 从 NSDictionary 读取数据

    我正在使用这段代码来读取数据NSDictionary let itemsArray NSArray response objectForKey items as NSArray let nextPageToken String respon
  • 如何对多列进行逆透视 SQL Server

    在我的应用程序中 我使用了商店产品描述值 如下所示 ID BILLNO CUS NAME DATE TOT BAL S1 S2 S3 S4 D1 D2 D3 D4 Q1 Q2 Q3 Q4 U1 U2 U3 U4 T1 T2 T3 T4 TO
  • DFT 频率组件 Opencv

    我使用以下链接来了解如何在Opencv中使用DFT http docs opencv org doc tutorials core discrete fourier transform discrete fourier transform
  • Node Express 发送图像文件作为 API 响应

    我用谷歌搜索了这个但找不到答案 但这一定是一个常见问题 这是同样的问题节点请求 读取图像流 通过管道返回响应 https stackoverflow com questions 17004990 node request read imag
  • Python“if X == Y and Z”语法

    做这个 if key name and item 意思和这个一样 if key name and if key item 如果是这样 我完全困惑了深入 Python 中的示例 5 14 http diveintopython net obj
  • pandas 数据透视表 - 有序类别导致意外的边距

    使用 python 3 7 和 pandas 0 23 4 我正在尝试使用有序分类数据制作数据透视表 如果我包括边距 则小计的顺序似乎不正确 import pandas as pd m male f female data num 0 1
  • 如何在 Xcode 4 中使用 nib 创建自定义 UITableViewCell?

    在 Xcode 3 中 我可以选择在创建表视图单元格子类时创建笔尖 在 Xcode 4 中 它只生成 h m 文件 如何使用 xib 文件创建子类 编辑 参见下面的屏幕截图 EDIT 此外 是否有任何方法可以自动创建 UITableView
  • MySQL 嵌套 JSON 列搜索并提取子 JSON

    我有一个 MySQL 表authors有柱子id name and published books 在这之中 published books是一个 JSON 列 有了样本数据 id name published books 1 Tina 1
  • keydown 事件中的输入验证

    我正在尝试在以下过程中对用户文本输入进行信息验证keydown事件 我试图验证的原因是keydown事件是因为我不想显示那些被认为是非法的字符input开头的盒子 我写的验证是这样的 function validateUserInput v