我想只得到正的值,有什么方法来防止它只使用html 请不要建议验证方法
当前回答
oninput="this.value=(this.value < Number(this.min) || this.value > Number(this.max)) ? '' : this.value;"
其他回答
我想允许小数,如果输入负数,不清除整个输入。这在铬至少工作良好:
<input type="number" min="0" onkeypress="return event.charCode != 45">
如果数字是负数或正使用ES6的数学。标志 Const num = -8; // Old Way Num === 0 ?Num: (Num > 0 ?1: -1);/ / 1 // ES6方式 Math.sign (num);/ / 1
oninput="this.value=(this.value < Number(this.min) || this.value > Number(this.max)) ? '' : this.value;"
如果你不想在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'];
}
@Manwal的回答很好,但我喜欢少写几行代码的代码,这样可读性更好。另外,我喜欢在html中使用onclick/onkeypress的用法。
我建议的解决方案也是如此: 添加
min="0" onkeypress="return isNumberKey(event)"
到HTML输入和
function isNumberKey(evt){
var charCode = (evt.which) ? evt.which : event.keyCode;
return !(charCode > 31 && (charCode < 48 || charCode > 57));
}
作为一个javascript函数。
如前所述,它做的是一样的。这只是个人对如何解决问题的偏好。