JavaScriptで消費税計算、四捨五入・切り上げ・切り捨て

• 2013年11月13日 13:28
• JavaScript

Tweet

※2013/11/19更新

現在5%の消費税率は、2014年4月に3%増の8%に、そして2015年10月には10%になることがほぼ決まりのようです。お店の値札はもちろん、Webサイトに表記してある値段も修正対応が必要になってきます。

そこで消費税を計算して表示するJavaScriptを用意してみました。jQueryを使っています。

JavaScriptで消費税計算

var tax = 1.05; //消費税5%
$(function() {
	$(".price").each(function(){
		var a = $(this).text(), //数値を取得
		b = a.replace(/￥/g,""), //￥マーク削除
		c = parseInt( b.replace(/,/g, ""), 10), //カンマ削除
		d = c * tax, //消費税計算
		e = Math.round(d).toString(), //四捨五入して文字列に
		price = e.replace(/(\d)(?=(\d{3})+$)/g, "$1,"); //カンマ追加
		$(this).children("span").text(" (税込 ￥" + price + ")"); //数値をもどす
	});
});

<p class="price">￥500<span></span></p>
<p class="price">￥1,250<span></span></p>
<p class="price">￥2,345,600<span></span></p>

• JavaScriptサンプル

JavaScript解説

IE6〜IE10動作確認済み。「var tax = 1.05」を変えてやれば、消費税8%や10%にも簡単に対応できます。あとはコメントの通りです。

税込み価格に書き換えるだけの場合は、最後の1行を下記に書き換えてHTML内のspan要素を削除して下さい。

$(this).text(price);

※2013/11/19追記
￥マークとカンマの削除は、まとめて下記でもいいです。

c = parseInt( a.replace(/￥|,/g, ""), 10),

それと、今回は2回しか出てこなかったのでそのままですが、「$(this)」の参照が複数回ある場合に、「$this = $(this)」として変数「$this」に代入しておくと「$(this)」を何度も呼び出すより処理が速くなるそうです(多川さんThanks！)。

var $this = $(this),
a = $this.text(),
...
$this.children("span").text(" (税込 ￥" + price + ")");

切り上げ、切り捨て

四捨五入ではなく、切り上げや切り捨てにしたい場合は下記を利用して下さい。

e = Math.ceil(d).toString(), //切り上げ
e = Math.floor(d).toString(), //切り捨て

おまけ　JavaScriptを1行で記述

$(function() {
	$(".price").each(function(){
		$(this).children("span").text(" (税込 ￥" + Math.round(parseInt($(this).text().replace(/￥/g,"").replace(/,/g, ""), 10) * tax).toString().replace(/(\d)(?=(\d{3})+$)/g, "$1,") + ")");
	});
});

Tweet