HTML 5货币格式

HTML 5 Currency format

本文关键字：格式 货币 HTML      更新时间：2023-09-26

我在页面中使用了大量HTML5输入控件。我的要求之一是有一个具有货币功能的文本框。为此，我尝试了这个：

<input type="number" pattern="(d{3})([.])(d{2})" />

这允许我键入10000.00 之类的值

但它仍然不能满足我的所有要求。如果用户输入10000它应该将其转换为货币格式，如10000onblur。

当我从Javascript中的输入类型读取值时，它应该给我一个浮点值，而不是一个字符串值，如果不进行解析，我就无法使用它进行计算。

这里有一个带有额外input type="text":的解决方法

http://jsfiddle.net/UEVv6/2/

HTML

<input type="text" id="userinput" pattern="[0-9]*">
<br>
<input type="number" id="number">

JS-

document.getElementById("userinput").onblur =function (){    
    //number-format the user input
    this.value = parseFloat(this.value.replace(/,/g, ""))
                    .toFixed(2)
                    .toString()
                    .replace(/'B(?=('d{3})+(?!'d))/g, ",");
    //set the numeric value to a number input
    document.getElementById("number").value = this.value.replace(/,/g, "")
}

regex来自这里如何在JavaScript 中以逗号作为千位分隔符打印数字

试试这个-http://jsbin.com/azOSayA/1/edit

function commaSeparateNumber(val){
    while (/('d+)('d{3})/.test(val.toString())){
      val = val.toString().replace(/('d+)('d{3})/, '$1'+','+'$2');
    }
    return val;
  }
$('#elementID').focusout(function(){
  alert(commaSeparateNumber($(this).val()));
});
相关文章：