我想只得到正的值,有什么方法来防止它只使用html 请不要建议验证方法
当前回答
我对@Abhrabm的回答不满意,因为:
它只是阻止负数输入 向上/向下箭头,而用户可以输入负数从键盘。
解决方法是防止用键码:
//选择输入元素。 var number = document.getElementById('number'); //在numInput上监听输入事件 号码。Onkeydown =函数(e) { 如果(! ((e。> 95 && e.keyCode < 106) || (e.keyCode > 47 && e.keyCode < 58) || e.keyCode == 8)) { 返回错误; } } <form action="" method="post"> <input type="number" id="number" min="0" /> <input type="submit" value="点击我!"/> > < /形式
由@Hugh Guiney提供的澄清:
正在检查哪些关键代码:
95, < 106对应Numpad 0到9; 47, < 58对应数字行上的0到9;8是 退格键。
所以这个脚本是防止在输入中输入无效的键。
其他回答
如果数字是负数或正使用ES6的数学。标志 Const num = -8; // Old Way Num === 0 ?Num: (Num > 0 ?1: -1);/ / 1 // ES6方式 Math.sign (num);/ / 1
简单的方法:
<input min='0' type=“number” onkeypress=“return (event.charCode == 8 || event.charCode == 0) ? null : event.charCode >= 48 && event.charCode <= 57”>
限制数字类型中的字符(-)和(e)
<input type="number" onkeydown="return event.keyCode !== 69 && event.keyCode !== 189" />
演示:https://stackblitz.com/edit/typescript-cwc9ge?file=index.ts
如果你不想在HTML中添加更多代码,只需要添加另一种方法(使用Angular):
您只需要订阅字段valueChanges并将Value设置为绝对值(注意不要触发新事件,因为这会导致另一个valueChange,因此会触发递归调用并触发最大调用大小超出错误)
HTML代码
<form [formGroup]="myForm">
<input type="number" formControlName="myInput"/>
</form>
TypeScript代码(在组件内部)
formGroup: FormGroup;
ngOnInit() {
this.myInput.valueChanges
.subscribe(() => {
this.myInput.setValue(Math.abs(this.myInput.value), {emitEvent: false});
});
}
get myInput(): AbstractControl {
return this.myForm.controls['myInput'];
}
对我来说,解决方案是:
<input type=“number” min=“0” oninput=“this.value = Math.abs(this.value)”>
Edit
正如注释中所建议的那样,如果0是最小值,则需要进行微小的更改。
<输入类型=“数字” min=“0” oninput=“this.value= !!this.value && Math.abs(this.value) >= 0 ?Math.abs(this.value) : null“>
推荐文章
- Java生成两个给定值之间的随机数
- 样式化HTML电子邮件的最佳实践
- CSS/HTML:什么是使文本斜体的正确方法?
- 我如何才能在表中应用边界?
- 如何使一个DIV不包装?
- CSS div元素-如何显示水平滚动条只?
- 将Dropzone.js与其他字段集成到现有的HTML表单中
- 使用“!”的含义是什么?重要的”?
- 资源解释为样式表,但以MIME类型text/html传输(似乎与web服务器无关)
- 复选框输入是否只在被选中时才发布数据?
- 是类型="文本/css"必须在<链接>标签?
- 如何将LaTeX与Markdown混合?
- 如何使<div>总是全屏?
- 如何中心div垂直内绝对定位的父div
- 创建一个可变长度的字符串,用重复字符填充