繁体   English   中英

防止用户在文本输入字段中输入某些字符

Prevent user from typing certain characters into a text input field

提示:本站收集StackOverFlow近2千万问答,支持中英文搜索,鼠标放在语句上弹窗显示对应的参考中文或英文, 本站还提供   中文繁体   英文版本   中英对照 版本,有任何建议请联系yoyou2525@163.com。

我不确定这叫什么。 这真的很简单。 我尝试使用管道,但出现错误。 我正在寻找一些简单的东西:

<input [(ngModel)]="order.name | lettersOnlyPipe"/>

那行不通。 我该怎么做才能做到这一点?

5 个回复

在最近的 Angular 4 版本中,您可以使用pattern属性来限制此功能中提到的字符

<input [(ngModel)]="order.name" pattern="" />

在其他情况下,您应该使用自定义指令处理它。 请参阅此答案以获取示例。

你最好的选择是你自己的指令。

一些让你前进的简单想法:

  • 您的指令监视其宿主元素上的输入事件
  • 在每个输入事件上,您检查输入值是否有效,如果无效,则将输入设置回其旧值

或者,* 监视 keydown 事件,并在每个 keydown 上检查该键是否为有效键 - 如果不是,请将您的输入设置回其旧值

这是基本的方法。 您可以查看angular 文档中的highlight 指令示例作为入门指南。

我在这里发布了类似的回复,您只需要更改正则表达式(从中删除数字和阿拉伯字符)。 希望能帮助到你。

input [name]="fullName" pattern="[a-zA-Z ]*" ngModel 

在 angular 4 中,您可以使用 Pattern 属性并将模式指定为= [a-zA-Z ]仅用于字母。

使用模式属性不会阻止在输入字段内输入任何内容。 它只会将其标记为无效。 您必须使用指令才能这样做。 这是一个简单的示例,它可以防止在输入字段中输入除正数以外的任何内容:

import {Directive, HostListener} from '@angular/core';

@Directive({
  selector: 'input[dsancNumeroPositif]'
})
export class NumeroPositifDirective {

  acceptedCharacters: string[] = ['.', ',', '0', '1', '2', '3', '4', '5', '6', '7', '8', '9'];

  constructor() { }

  @HostListener('keypress', ['$event']) onInput(event: KeyboardEvent): void
  {
    if (!this.acceptedCharacters.includes(event.key)) {
      event.preventDefault();
    }
  }

}
2 防止在文本字段中输入某些字符

我试图只允许在文本框中输入以下字符: A到Z大写字母,小写字母Ñ和ñ和空格。 Onkeyup上运行以下功能: 我所做的事情不好的是,该字段仍然接受以下特殊字符: 有人对此有智慧吗? ...

3 如何防止用户在输入字段中输入无效字符

给定一个文本输入字段。 如何防止用户输入空格以及字母数字或破折号 (-) 以外的空格。 仅限字母数字 - “字母数字字符集由数字 0 到 9 和字母 A 到 Z 组成。在 perl 编程语言中,下划线字符 (_) 也被认为是字母数字字符集的成员” 这是用于用户可以选择自定义 url 的字段。 我 ...

4 如何防止用户在文本字段(字符类型)中输入特殊字符(例如键盘上不可见的符号)?

如何防止用户在AS400的文本字段(字符类型)中输入特殊字符(例如键盘上不可见的符号)? 显然,在大多数情况下,iseries / as400接受它并将其保存到文件中并没有问题,但是有时,当数据在下游报告系统中处理时,它会由于系统错误而被拒绝。 有没有办法防止进入点本身? 例如:在“客 ...

7 防止用户在文本字段中输入仅大写的值

我有一个预订系统,客户的姓名必须输入到一个简单的 html5 输入字段(输入文本)。 一些预订者不断以大写字符输入姓名。 有没有办法(可能通过Javascript)将大小写更改为正常的标题大小写(第一个字符和空格大写后的字符,后面的字符小写)? 别急,这不是那么容易... 复杂性:如果这个世界上没 ...

8 防止用户在需要验证的文本字段中输入null

有没有一种方法可以告诉淘汰赛,如果用户在必需的文本字段中输入null,它将是无效的。 这只会迫使用户键入空格以外的任何内容。 编辑: 我已经尝试过了,但没有成功: 例外: ...

10 如何防止在输入字段中输入无效字符

Onkeydown ,我运行以下 JavaScript: 这三个标题属性之一被赋予页面上的各种输入字段。 只要正确擦除无效字符,该代码就可以工作,但直到输入下一个字符。 我想找到一种方法来简单地拒绝无效输入。 我感谢您的帮助! 编辑:我在全球范围内创建事件。 我是这样做的: Globa ...

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2022 STACKOOM.COM