JavaScript正則表達式：如何讓oninput模式中只有2個十進制浮點數匹配？

Question

我有一個附加了輸入事件處理程序的輸入type =“ text”，我想用它通過用戶按鍵的“過濾”結果覆蓋input.value。

基本上我想寫一個只允許（可選）2個小數位的浮點數（正數或負數）的正則表達式。

這是我要尋找的腳本示例 。

如果您在上面的示例中集中輸入時按下任意鍵，則將使用正則表達式和JavaScript的組合來過濾輸入值。

我的測試輸入當前看起來像這樣：

<input type="text" id="test" value="-3c.fvbnj23.79.8fbak-cfb436.sdafosd8r32798s.hdf-5kasjfds-gf..">

輸入事件處理程序如下所示：

document.getElementById('test').oninput = function(){
  var foundDot = false,
      str = '';

  this.value.replace(/^-|\.(?=\d)|\d*/g, function(match){
    if (match === '.' && foundDot === true) {
      return;
    }

    if (match === '.' && foundDot === false) foundDot = true;

    str += match;
  });

  this.value = parseFloat(str).toFixed(2);
}

僅使用正則表達式能否獲得相同的結果？

Answer 1

更好的是，完全不需要正則表達式就可以完成。

好吧，一個正則表達式。 我誤解了您想保留非數字字符串中的數字。

好吧，fiiiiine，兩個正則表達式。 ¯\\ _（ツ）_ /¯

 //oninput is too aggressive, it runs on every keystroke making it difficult to type in longer values. document.getElementById('test').onchange = function(){ // strip non-numeric characters. // First char can be -, 0-9, or . // Others can only be 0-9 or . var val = this.value.replace(/(?!^[\\-\\d\\.])[^\\d\\.]/g,''); // strip out extra dots. Here I admit regex defeat and resort to slice-and-dice: var firstDot = this.value.indexOf('.'); if (firstDot > -1) { val = val.substr(0,firstDot+1) + val.substring(firstDot+1).replace(/\\./g,'') } console.log(val); // Finally the easy part: set the precision this.value = parseFloat(val).toFixed(2); } 

 <input id="test"> 

Answer 2

我不知道為什么您不能僅對每個按鍵使用查找/替換。

找到^([-+]?(?:\\d+(?:\\.\\d{0,2})?|\\.\\d{0,2})?)
替換$1

展開式

  ^ 
 (                             # (1 start)
      [-+]? 
      (?:
           \d+ 
           (?:
                \. \d{0,2} 
           )?
        |  
           \. \d{0,2} 
      )?
 )                             # (1 end)