小数点以下1桁しか入力できない

Question

入力時に数字を書式化しようとしていますが、有効な数字のみを挿入できます。私は小数点を除いてすべてが働いています。入力ボックスは、私が望むように多くの小数を挿入することができますが、私は1つだけを許可したいと思います（最後のreplace()を参照）。ここで

element.oninput = e => { 
    let value = e.currentTarget.value; 
    let result = value 
     // Remove anything that isn't valid in a number 
     .replace(/[^0-9-.]/g, '') 
     // Remove all dashes unless it is the first character 
     .replace(/(?!^)-/g, '') 
     // Remove all periods unless it is the last one 
     .replace(/(?!)\./g, ''); 
    element.value = result; 
} 

https://jsfiddle.net/c4f1L3kv/1/

いくつかの有効な入力です。ここ

123.123 
-123.12 
123 
-123 
.123 
-.123 

は、いくつかの不正な入力です：

123-123 
1-2-3 
123.123.123 
123-123..12 

Answer 1

あなただけ、あなたは以下の式のようにpositive lookaheadを使用することができ、それは別のピリオド文字が続いている場合にはピリオドを一致させたい場合は：

/\.(?=.*\.)/g 

説明：

• \. - 文字に一致する.文字
• (?= - 肯定的な先読みの開始
  • .*\. - リテラル.文字までゼロ個以上の文字に一致します。
• ) - 下のあなたのコメントに基づいて

var element = document.querySelector('input'); 
 
element.addEventListener('input', (event) => { 
 
    event.target.value = event.target.value 
 
    // Remove anything that isn't valid in a number 
 
    .replace(/[^\d-.]/g, '') 
 
    // Remove all dashes unless it is the first character 
 
    .replace(/(?!^)-/g, '') 
 
    // Remove all periods unless it is the last one 
 
    .replace(/\.(?=.*\.)/g, ''); 
 
});

<input type="text" />

---

肯定先読みのクローズ：あなたがからユーザーを防ぐために、希望の場合

期間文字aを追加する最後にピリオド文字がある場合は文字列の最後には/(\..*)\.$/の式を使用し、最初のキャプチャグループをそのキャプチャグループに置き換えることで、キャプチャグループにないもの（つまり最後のピリオド文字）を効果的に削除します。 。

var element = document.querySelector('input'); 
 
element.addEventListener('input', (event) => { 
 
    event.target.value = event.target.value 
 
    // Remove anything that isn't valid in a number 
 
    .replace(/[^\d-.]/g, '') 
 
    // Remove all dashes unless it is the first character 
 
    .replace(/(?!^)-/g, '') 
 
    // Remove the last period if there is already one 
 
    .replace(/(\..*)\.$/, '$1') 
 
    // Remove all periods unless it is the last one 
 
    .replace(/\.(?=.*\.)/g, ''); 
 
});

<input type="text" />

Answer 2

var element = document.querySelector('input'); 
 

 

 
element.oninput = e => { 
 
    let value = e.currentTarget.value; 
 
    let result = value 
 
     .replace(/[^0-9-.]/g, '') 
 
     .replace(/(?!^)-/g, '') 
 
     // prevent inserting dots after the first one 
 
     .replace(/([^.]*\.[^.]*)\./g, '$1'); 
 
    element.value = result; 
 
}

<input/>