HTML 5 Định dạng tiền tệ

Question

Tôi đang sử dụng rất nhiều điều khiển nhập HTML 5 trong các trang của mình. Một trong những yêu cầu của tôi là có một hộp văn bản với tính năng tiền tệ. Đối với điều này tôi đã cố gắng này:

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

này cho phép tôi để gõ giá trị như 10,000.00

Nhưng vẫn không đáp ứng được tất cả mọi yêu cầu của tôi của nó. Tôi muốn rằng nếu người dùng nhập 10000 , nó sẽ chuyển đổi thành định dạng tiền tệ như 10.000 onblur.

Và khi tôi đọc giá trị từ loại đầu vào trong Javascript của tôi, nó sẽ cho tôi một phao thay vì giá trị chuỗi mà tôi không thể sử dụng để tính toán mà không phân tích cú pháp.

Answer 1

Dưới đây là một cách giải quyết với thêm một 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 là từ đây How to print a number with commas as thousands separators in JavaScript

Answer 2

thử này - 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())); 
});