如何在HTML網頁的文本字段中添加逗號

Question

我有一個網頁，我在其中輸入數據到<input />，就像1000，所以我希望它看起來像1000，但它不會更改它僅顯示的ID值因爲我在其他計算中使用相同的ID，所以如果1,000，那麼它會顯示NaN ...我怎麼能避免這種情況？

<input type="text" id="test" onBlur="addCommas()"> 
<script> 
    function addCommas(nStr){ 
     var offset = nStr.length % 3; 
     if (offset == 0) 
      return nStr.substring(0, offset) + nStr.substring(offset).replace(/([0-9]{3})(?=[0-9]+)/g, "$1,"); 
     else 
      return nStr.substring(0, offset) + nStr.substring(offset).replace(/([0-9]{3})/g, ",$1"); 
    } 
    alert(addCommas("1234567")); 
</script> 

我有這個代碼從論壇...沒有人有一個想法如何使這個功能簡單，所以，它只是顯示了在輸入框中，但是當我得到的ID值，這表明1000？

Answer 1

測試你與this值：

function isNumber(n) { 
    return !isNaN(parseFloat(n)) && isFinite(n); 
} 

它會阻止你的NAN的。

使用@皮特的link to know how to print a number with commas as thousands separators in JavaScript

編輯有關您的評論： 然後你可以使用一個<input type="hidden" id="testValue" />並存儲在它的真正價值。

所以您的代碼將是這樣的：

<input type="text" id="test" onBlur="addCommas(this)"> 
<input type="hidden" id="testRealValue"> 
<script> 
    function isNumber(n) { 
     return !isNaN(parseFloat(n)) && isFinite(n); 
    } 
    function addCommas(input){ 
     nStr = input.value; 
     if(!isNumber(nStr))return; 
     document.getElementById("testRealValue").value = nStr; 
     var offset = nStr.length % 3; 
     if (offset == 0) 
      input.value = nStr.substring(0, offset) + nStr.substring(offset).replace(/([0-9]{3})(?=[0-9]+)/g, "$1,"); 
     else 
      input.value = nStr.substring(0, offset) + nStr.substring(offset).replace(/([0-9]{3})/g, ",$1"); 
    } 
</script> 

這裏是jsfiddle