金額表示で3桁ごとにカンマを付ける方法
- JavaScriptで金額を表示する際にカンマ(,)を付ける方法について。
- toLocaleString関数を使用すれば、簡単に金額にカンマを付けることができます。
- 具体的なコード例を紹介します。
- ベストアンサー
金額表示で3桁ごとにカンマを付ける方法
こんにちは。 JavaScriptで金額を表示する際にカンマ(,)を付けたいのですがうまくできません。 「値段は10,800円(税込)です。」と表示させたいのです。 toLocaleString関数を使用すればいいらしいですが、どのように記述すればいいのかわかりませんでした。 ご教示頂けませんか。 宜しくお願い致します。 <section> <p id="output"></p> </section> <script> var total = function(price) { var tax = 0.08; return price + price * tax; } document.getElementById('output').textContent = '値段は' + total(10000) + '円(税込)です。'; </script>
- cometruejp
- お礼率100% (6/6)
- JavaScript
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
その地域の表示形式（ローカル）での表示には「toLocaleString()」を使ってもいいのですが、動作環境によって表示が異なる（ローカルの環境に任せてしまうため）ので、他の方法も含めて以下のような方法があるようです。 JavaScript カンマ区切りフォーマット - Miuran Business Systems http://www.m-bsys.com/code/javascript-commaformat
関連するQ&A
- javascriptで数値を3桁区切りで表示
数値を取得して消費税計算をして四捨五入して、あとは3桁区切りでカンマを付けて戻すだけなのですが、カンマの付け方がわかりません。 よろしくお願いします。 <script type="text/javascript"> var tax = 1.05; var targetClass='.price'; $(function() { $(targetClass).each(function(){ var price_a = $(this).text(); var price_b = price_a.replace(/,/g, ""); var price_c = price_b * tax; var price_d = Math.round(price_c); //切り上げ var price_d = Math.ceil(price_c); //切り捨て var price_d = Math.floor(price_c); $(this).text(price_d); }); }); </script> <p class="price">1,000</p> <p class="price">1,250</p> <p class="price">1,360</p> <p class="price">1,450</p> <p class="price">1,550</p> <p class="price">1,600</p>
- ベストアンサー
- JavaScript
- Javascript 計算後の３桁区切り
ホームページ用見積もりフォームをJavascriptで自動計算 縦に長いページで一番下に計算結果を表示 ページをスクロールしても、何時でも計算結果が見られるように、別のウィンドウ（レイヤー）でページ内に表示。 以上までは出来ました。 最後に計算結果を３桁区切りで表示させたいのですが、上手く出来ません。 お知恵をお貸しくださいませ。 Javascriptは外部参照しております。 ３桁区切りのJavascriptを外部参照している同一のページに記入した方が良いか、別参照の方が良いかも教えていただければ幸いです。 以下がJavascriptのコードになります。 function keisan(){ // 設定開始 var tax = 5; // 消費税率 // 商品1 var price1 = document.form1.goods1.options[document.form1.goods1.selectedIndex].value; // 商品2 var price2 = document.form1.goods2.options[document.form1.goods2.selectedIndex].value; // 商品3 var price3 = document.form1.goods3.options[document.form1.goods3.selectedIndex].value; // 合計を計算 var total1 = parseInt(price1) + parseInt(price2) + parseInt(price3) ; // 設定終了 document.form1.field_total1.value = total1; // 合計を表示 var tax2 = Math.round((total1 * tax) / 100); document.form1.field_tax.value = tax2; // 消費税を表示 document.form1.field_total2.value = total1 + tax2; // 税込合計を表示 //右の窓に表示する金額 document.getElementById("display_account_amount").innerHTML = total1; document.getElementById("display_account_tax").innerHTML = tax2; document.getElementById("display_account_all").innerHTML = total1 + tax2; }
- ベストアンサー
- JavaScript
- input値をボタンでoutput表示する方法
質問の内容が分かりにくかったので再質問させていただくことにしました。 現在公開しているホームページで、うまく作動しない箇所が見つかり対応に苦慮しています。 問題点を分かりやすくするために、inputした値をGoボタンでoutputに出力表示する簡単なサンプルに落とし込んでみました。 output1はfunction go()内、output2はfunction go()外での出力表示です。 output2の要件として、htmlが開かれた時にはinputの初期値を、Goボタンでinputを更新した時はその値を表示したいのですが、初期値のまま更新できません。 参考チェック用のoutput1には正しく表示されます。 解決方法を教えていただけると助かります。 <html> <head> <title>input-output</title> </head> <body> <p> <label for="input">input</label> <input type="number" id="input" value="100"> </p> <p> <input type="button" onclick="go();" value="Go"> </p> <p> <label for="output1">output1</label> <input type="text" id="output1"> </p> <p> <label for="output2">output2</label> <input type="text" id="output2"> </p> <script> var input; go(); function go() { input= document.getElementById("input").value; var output = document.getElementById("output1"); output.value = input; } var output = document.getElementById("output2"); output.value = input; </script> </body> </html>
- ベストアンサー
- JavaScript
- ループ、プログラムなのに！？
以下のプログラムは、ただの乗算と、その合計を計算するだけなのに、なんでfor (var i = 1; i < 4; i++) { のループ、プログラムなのですか？ もし同じ計算結果のダイアログBOXで、Javaの範疇で組むのであれば、他にどんなプログラムがあるのですか？ よろしくお願いします。 <HTML> <HEAD> <TITLE>ループ</TITLE> <script tytpe="text/javascript"> <!-- function calc(){ var alltotal = 0; for (var i = 1; i < 4; i++) { var price = document.getElementById("price" + i).innerHTML; var num = document.getElementById("num" + i).value; var total = price * num; document.getElementById("total" + i).innerHTML = total; alltotal += total; } document.getElementById("alltotal").innerHTML = alltotal; } </script> </HEAD> <body> <p><span id="price1">100</span><input id="num1" value="0" /><span id="total1">1の合計</span></p> <p><span id="price2">200</span><input id="num2" value="0" /><span id="total2">2の合計</span></p> <p><span id="price3">300</span><input id="num3" value="0" /><span id="total3">3の合計</span></p> <div id="alltotal">合計</div> <button onclick="calc()">計算</button> </body> </HTML>
- ベストアンサー
- JavaScript
- input値をボタンでoutput表示 Edgeで
現在公開しているホームページで、Firefoxでは作動するのにEdgeでは作動しない箇所が見つかり対応に苦慮しています。 問題点を分かりやすくするために、inputした値をGoボタンでoutputに表示するだけの簡単なサンプルに落とし込んでみました。 <html> <p> <label for="input">input</label> <input type="number" id="input" value="100"> </p> <input type="button" onclick="location.reload();" value="Go"> <p> <label for="output">output</label> <input type="number" id="output"> </p> <script> var input= document.getElementById("input").value; var output = document.getElementById("output"); output.value = input; </script> </html> 基本シロウトなので正確なことは分かりませんが、ブラウザ間でreloadの仕様が異なり、Edgeではreloadにより表示画面がリセットされてしまうことが原因のようです。 解決策、またreloadを使用しないもっと良い方法などありましたら教えてください。 よろしくお願いいたします。
- ベストアンサー
- JavaScript
- JavaＳの追加計算
function keisan(){ // 設定開始 var price1 = document.form1.kazu.value; // 合計を計算 if (price1 < 10000) { var total = parseInt(price1)*44/10000; } else { var total = parseInt(price1)*45/10000; } else if // 設定終了 document.form1.field_total.value = total; // 合計を表示 } // --> </SCRIPT> 上記に追加で*22/10000の計算を入れたいのですがどうしたらいいのですようか？ 初心者なので申し訳ございませんがご教授お願い致します。
- 締切済み
- JavaScript
- JavaScriptの画面表示について
●質問の主旨 次の文章の内容をGoogleChrome上で 表記したいのですが、 5行目の 「30個ご購入なら、通常72000円のところが、今なら48900円！」 が表記されません。 以下に示すコードのうちどこに問題があるでしょうか？ ご存知のかたご教示よろしくお願いします。 ●本来表記したい文章 新製品 テンデイパックS のご紹介 話題の テンデイパックS を通常価格 2400 円のところを 特別価格 1680 円でご提供！ まとめ買いならさらにお得！ 10個につき500円お引きします。 30個ご購入なら、通常72000円のところが、今なら48900円！ ●JavaScriptのコード <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <title>10日で覚えるJavaScript</title> <script type="text/javascript"> //変数の定義 var prod_name = 'テンデイパックS'; var prod_price = 2400; </script> </head> <body> <h1>新製品 <script type="text/javascript">document.write(prod_name);</script> のご紹介</h1> <p>話題の <script type="text/javascript">document.write(prod_name);</script> を通常価格 <script type="text/javascript">document.write(prod_price);</script> 円のところを</p> <p>特別価格 <script type="text/javascript">document.write(prod_price*0.7);</script> 円でご提供！</p> <p>まとめ買いならさらにお得！10個につき500円をお値引きいたします。</p> <script type="text/javascript"> var kosuu = 30; var special_price = prod_price * 0.7 * kosuu - kosuu / 10 * 500; document.write('<p>' + kosuu + '個ご購入なら、通常' + (prod_price * kosuu) + '円のところが、今なら' + special_price + '円!'</p>; </script> </body> </html>
- ベストアンサー
- JavaScript
- 自動計算の合計金額を次ページで表示
いつも『教えて！goo』を活用させていただきありがとうございます。 またお世話になます。 今回はJavascriptで自動計算させた合計金額を、別ページで表示させることで困っております。 同じページで合計金額の表示はでき、それを基にパラメータで引き渡そうとしているのですが、なかなかうまくいきません。 同じページで合計金額の表示のタグ構成は以下のとおりです。 ＜自動計算側ページ：index.html＞＝＝＝＝＝＝＝＝＝＝＝＝ <html> <head> <SCRIPT language="JavaScript"> <!-- function cal(f){ var price=0; for(var i=0;i<f.length;i++){ if(f[i].type=="radio" && f[i].checked) price+=parseInt(f[i].value); } f.price.value=price; } //--> </SCRIPT> </head> <body> <form> <p> <input type="radio" name="group1" value="30" />金：30円 <input type="radio" name="group1" value="20" />銀：20円 <input type="radio" name="group1" value="10" />銅：10円 </p> <p> <input type="radio" name="group2" value="400" />ダイヤモンド：300円 <input type="radio" name="group2" value="300" />サファイア：200円 <input type="radio" name="group2" value="200" />ルビー：100円 <input type="radio" name="group2" value="100" />アメジスト：100円 </p> <p> <input type="radio" name="group3" value="3000" />リチウム：3,000円 <input type="radio" name="group3" value="2000" />チタン：2,000円 <input type="radio" name="group3" value="1000" />白金：1,000円 </p> <hr /> <p><input type="button" value="合計金額を計算" onClick="cal(this.form)" /><br /> 合計：<input type="text" name="price" style="text-align:right" size="10" />円</p> </form> </body> </html> <p><input type="button" value="合計金額を計算" onClick="cal(this.form)" /><br /> 合計：<input type="text" name="price" style="text-align:right" size="10" />円</p> の箇所を<input type="submit" value="次ページで計算" />に書き換えて、 function cal(f){内に var pram="price="+price location.href="price.html?"+price; return false; を追記し、以上でテストすると ＜index.html?group1=30&group2=300&group3=1000#＞といった風に radioボタンのnameとvalueが付いてしまい＜price.html＞にリンクしません。 以下に＜合計金額表示ページ：price.html＞も明記させていただきますので 皆様には、大変ご迷惑をおかけしますが、何卒ご回答の程よろしくお願い申し上げます。 ＜合計金額表示ページ：price.html＞＝＝＝＝＝＝＝＝＝＝＝＝ <html> <head> <SCRIPT language="JavaScript"> <!-- function pramWrite() { var pram=location.search; if (!pram) return false; pram=pram.substring(1); document.form1.price.value=pram; } //--> </script> </head> <body onload="pramWrite()"> <form name="form1" action="#"> 合計：<input type="text" name="price" style="text-align:right" size="10" />円 </form> </body> </html>
- ベストアンサー
- JavaScript
- for文についてご教授ください
javascriptを学習しています。初級者のためご教授のほどお願いします。 <!DOCTYPE html> <html lang="ja"> <head> <script> function kazu(){ var fObj = document.itemlist; var price1 = fObj.item1.options[fObj.item1.selectedIndex].value; var price2 = fObj.item2.options[fObj.item2.selectedIndex].value; var total = parseFloat(price1) + parseFloat(price2); document.getElementById("total").value = total; } </script> </head> <body> <header> <form action="#" name="itemlist" > <table> <tr> <td> <select name="item1" onchange="kazu()"> <option value="100">itemA-1</option> <option value="200">itemA-2</option> </select> </td> </tr> <td> <select name="item2" onchange="kazu()"> <option value="1000">itemB-1</option> <option value="2000">itemB-2</option> </select> </td> </tr> <tr> <td name="total"> <input type="text" value="" id="total" /> </td> </tr> </table> </form> </body> </html> 上記の内容をfor文を使い動作するようにと思っています。 自分で以下の内容を考えたのですがが動作しません。 以下の内容の問題点を教えいただければと思います。なにとぞよろしくお願いいたします。 function kazu(){ var fObj = document.itemlist; var len = document.itemlist.length; for(i=1;i<=len;i++){ var price[i] = fObj.item[i].options[fObj.item[i].selectedIndex].value; } var total = parseFloat(price1) + parseFloat(price2); document.getElementById("total").value = total; }
- 締切済み
- JavaScript
- javaのプログラムの答えを教えてください…
JAVAのプログラムを教えて下さい… 授業で課題が出ているのですがプログラミングが苦手で全く分からず助けてほしいです 途中まではやってみましたが詰まっています… 問題は Carクラスにクラス変数(num) クラスメソッド(show_num)を追加し インスタンス番号を表示するというものです // kadai4_3.java class Car { public static int num =1 String car_no.name; int price; public Car(){ price=0; num++; } void set_value(String c, String n, int p){ car_no=c; name=n; price=p double tax_calc() { double tax_price; tax_price = (double)(price*1.08); return tax_price; public static void } void show(double t) { System.out.println("車番号 =" +car_no); System.out.println("車種 ="+name); System.out.println("価格(税込)=" + t + "万円"); } } public class kadai4_3 { public static void main (String args[ ]) { Car car1 = new Car(); car1.set_value("P001", "ポルシェ", 1200); double tax_price = car1.tax_calc(); car1.show(tax_price); Car car2 = new Car(); car2.set_value("V001", "ベンツ", 800); tax_price=car2.tax_calc(); car2.show(tax_price); Car car3 = new Car(); car3.set_value("B001", "BMW",600); tax_price=car3.tax_calc(); car3.show(tax_price); } } 実行結果はこうなるそうです インスタンス番号:1 車番号＝P001 車種(税込)＝ポルシェ 価格(税込)＝1296.0万円 インスタンス番号:2 車番号＝V001 車種(税込)＝ベンツ 価格(税込864万円 インスタンス番号:3 車番号＝B001 車種＝BMW 価格(税込)＝648万円
- 締切済み
- Java
お礼
ありがとうございました。 以下のように修正して解決しました。 <script> var total = function(price) { var tax = price * 1.08; return ("" + tax).replace(/(\d)(?=(\d\d\d)+$)/g, "$1,"); } document.getElementById('output').textContent = '値段は' + total(10000) + '円(税込)です。'; </script>