次のhtml5入力要素があります。
<input type="number">
この入力で文字「e」を入力フィールドに入力できるのはなぜですか?他のアルファベット文字は入力できません(期待どおり)
Chromeを使用するv。44.0.2403.107
私の意味を確認するには:http : //www.w3schools.com/html/tryit.asp?filename=tryhtml_input_number
次のhtml5入力要素があります。
<input type="number">
この入力で文字「e」を入力フィールドに入力できるのはなぜですか?他のアルファベット文字は入力できません(期待どおり)
Chromeを使用するv。44.0.2403.107
私の意味を確認するには:http : //www.w3schools.com/html/tryit.asp?filename=tryhtml_input_number
回答:
それは仕様がそれが機能するはずであると正確に言っているからです。数値入力では、負の記号やor 文字(指数はorの後の数値)を含む浮動小数点数を受け入れることができます。e
E
e
E
浮動小数点数は、次の部分で構成され、正確に次の順序で表示されます。
- 必要に応じて、最初の文字は "
-
"文字でもかまいません。- 「
0—9
」の範囲の1つ以上の文字。- オプションで、以下のパーツを正確に次の順序で:
- "
.
"文字- 「
0—9
」の範囲の1つ以上の文字- オプションで、以下のパーツを正確に次の順序で:
- "
e
"文字または "E
"文字- オプションで、 "
-
"文字または "+
"文字- 「
0—9
」の範囲の1つ以上の文字。
e
と、他の方法では入力するのが面倒な大量の数値を圧縮するのに役立ちます。ささいな例として2e2 = 2*10^2 = 200
e
指数を表します。
以下のように簡単にできます
<input type="number" onkeydown="javascript: return event.keyCode == 69 ? false : true" />
更新された回答
@ 88 MPGが示唆するように、さらにシンプルにすることができます
<input type="number" onkeydown="return event.keyCode !== 69" />
return event.keyCode !== 69
不要な3項演算子を回避するため、使用することをお勧めします。インライン化もお勧めしません。
e
やE
フィールドでの使用を妨げるものではありません
数字のみで構成される数値の使用を強制する最良の方法:
<input type="number" onkeydown="javascript: return event.keyCode === 8 ||
event.keyCode === 46 ? true : !isNaN(Number(event.key))" />
数字キーのみを許可するには:
isNaN(数値(イベント。キー))
"Backspace"(keyCode:8)と "Delete"(keyCode:46)を受け入れます...
<input type="number" onkeydown="return FilterInput(event)" onpaste="handlePaste(event)" >
function FilterInput(event) {
var keyCode = ('which' in event) ? event.which : event.keyCode;
isNotWanted = (keyCode == 69 || keyCode == 101);
return !isNotWanted;
};
function handlePaste (e) {
var clipboardData, pastedData;
// Get pasted data via clipboard API
clipboardData = e.clipboardData || window.clipboardData;
pastedData = clipboardData.getData('Text').toUpperCase();
if(pastedData.indexOf('E')>-1) {
//alert('found an E');
e.stopPropagation();
e.preventDefault();
}
};
文字e
とマイナス記号の両方を非表示にする-
には、次のようにします。
onkeydown="return event.keyCode !== 69 && event.keyCode !== 189"
角度を使用して、e、+、-、Eの入力を制限することができます
<input type="number" (keypress)="numericOnly($event)"/>
numericOnly(event): boolean { // restrict e,+,-,E characters in input type number
debugger
const charCode = (event.which) ? event.which : event.keyCode;
if (charCode == 101 || charCode == 69 || charCode == 45 || charCode == 43) {
return false;
}
return true;
}
機能的にはrinkuの回答と同じですが、IDE警告が防止されます
numericOnly(event): boolean {
// noinspection JSDeprecatedSymbols
const charCode = (event.which) ? event.which : event.key || event.keyCode; // keyCode is deprecated but needed for some browsers
return !(charCode === 101 || charCode === 69 || charCode === 45 || charCode === 43);
}
.
、一部のブラウザーでは+、-、および複数回入力することもできます。