16

ページで多くの HTML 5 入力コントロールを使用しています。私の要件の 1 つは、通貨機能を備えたテキスト ボックスを用意することです。このために私はこれを試しました：

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

これにより、10,000.00 のような値を入力できます。

しかし、それでもすべてが私のすべての要件を満たしているわけではありません。ユーザーが 10000 を入力した場合、10,000 onblur のような通貨形式に変換する必要があります。

そして、Javascript の入力タイプから値を読み取ると、解析せずに計算するために使用できない文字列値ではなく浮動小数点数が返されます。

4

2 に答える 2

27

追加の回避策は次の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, "")

}

正規表現はこちらから

于 2013-08-19T08:47:20.167 に答える
2

これを試してください - 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-19T08:10:06.390 に答える