HTML 5貨幣格式

我在頁面中使用了很多HTML 5輸入控件。我的要求之一是有一個帶有貨幣功能的文本框。對於這個我想這：HTML 5貨幣格式

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

這讓我像10,000.00

但還是它的所有不符合我所有的需求類型的值。我想，如果用戶輸入10000 它應該將其轉換爲像10,000 onblur貨幣格式。

當我從我的Javascript中的輸入類型中讀取值時，它應該給我一個浮點數而不是字符串值，我不能用它來計算沒有解析。

來源

2013-08-19 user2561997

'INPUT TYPE = 「號碼」 .value'將在任何情況下的字符串。無論如何，你需要在某個點解析它... – Teemu

input type =「number」.value在任何情況下都是字符串。但是有簡單的parseFloat（input type =「number」.value）在所有情況下都可以工作。 – user2561997

這裏有一個額外input type="text"解決方法：

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

HTML

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

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, "") 

}

正則表達式是從這裏How to print a number with commas as thousands separators in JavaScript

來源

2013-08-19 08:47:20

感謝這解決了我的問題，加上在這之下的Amith解決方案。 – user2561997

試試這個 - 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())); 
});

來源

2013-08-19 08:10:06 Amith

感謝Amith。你解決了我的問題。 – user2561997

HTML 5貨幣格式

回答

相關問題