自動計算フォームAにて金額のカンマ挿入について

[新着] Webテンプレートを仮オープンしました



0   名前: しんぺ : 2007/02/02(金) 15:31  ID:dXGkpcm1 sub-t1
javascript初心者ですがどうぞよろしくお願い致します。

自動計算フォームAにて計算後に3桁ごとにカンマを付与してブラウザへ表示させたいと思っています。
いろいろ3桁ごとのカンマを付与するスクリプトを調べたのですが、適切なものが見つかりませんでした。
返ってきた数値をマウスクリックしたりフォーム移動して初めてカンマがつくので希望にかなっていないのです。

希望は、計算後にその場で3桁ごとのカンマをつけた文字列に変換してブラウザへ返すようにしたいのです。
ブラウザ上にはすでにカンマの付いた数値が出ていて欲しいのですが良いアドバイスをお願いいたします。

1   名前: 匿名 : 2007/02/02(金) 15:31  ID:iK.3Z8B0 sub-kJ
イベントを (on)keyup にでも変更しる。

2   名前: しんぺ : 2007/02/02(金) 15:31  ID:dXGkpcm1 sub-t1
返信ありがとうございます。

(on)keyupだとそのフォームを選択しないと変化しないですよね?
計算されてブラウザに表示される時点で3桁ごとのカンマをつけたいのです。。

3   名前: 匿名 : 2007/02/02(金) 15:31  ID:iK.3Z8B0 sub-kJ
> (on)keyupだとそのフォームを選択しないと変化しないですよね?

?意味が分からない。keyup イベントは押したキーが戻った瞬間に発動する。つまり、入力コントロールにイベント登録しておけば、入力と同時にコンマ付加を行うことになる。

> 計算されてブラウザに表示される時点で3桁ごとのカンマをつけたい

ならば、ブラウザに表示させる時点でコンマ付ければ良い。と言うか、ほとんどのスクリプトはそうなってるはずだが。

どこで躓いているのかさっぱり分からないので、現状の(作りかけで良いから)ソースコードを提示しながら説明してくれると嬉しい。

4   名前: 匿名 : 2007/02/02(金) 15:31  ID:iK.3Z8B0 sub-kJ
参考。
<input onkeyup="
  this.value = this.value.replace( /,/g, '').replace( /((?:^[-+])?\d{1,3})(?=(?:\d\d\d)+(?!\d))/g, '$1,');
">

5   名前: しんぺ : 2007/02/02(金) 15:31  ID:Gp/Rm4xo sub-t1
ありがとうございます。分かりづらくてごめんなさい。

http://www.tagindex.com/javascript/form/comp1b.html
タイトルのフォームAというのはここのフォームを利用させて頂いています。
この時に数量を入れ、計算された数値が表示された時点でカンマ付けをしたいのです。

この下記、工程中にカンマ付けさせて返すということをしたいのですがヒントがみつけられなかったのです。
または全く違う方法があればお勧めくださいませ。


<SCRIPT TYPE="text/javascript">
<!--

function keisan(){


// 設定開始

// 商品1
var price1 = document.form1.goods1.selectedIndex * 500; // 単価を設定
document.form1.field1.value = price1; // 小計を表示

// 商品2
var price2 = document.form1.goods2.selectedIndex * 1000; // 単価を設定
document.form1.field2.value = price2; // 小計を表示

// 商品3
var price3 = document.form1.goods3.selectedIndex * 3000; // 単価を設定
document.form1.field3.value = price3; // 小計を表示

// 合計を計算
var total = price1 + price2 + price3;

// 設定終了


document.form1.field_total.value = total; // 合計を表示

}

// -->
</SCRIPT>

6   名前: naokun : 2007/02/02(金) 15:31  ID:qYaxPHkv sub-Q5
>しんぺ さん
当方IE6,WinXpですが、4 匿名さんのコードで動きました。
しんべさんの環境では駄目だったのでしょうか?

function keisan(){

var SetVal;

// 設定開始

// 商品1
var price1 = document.form1.goods1.selectedIndex * 500; // 単価を設定
SetVal = String(price1);
SetVal = SetVal.replace( /,/g, '').replace( /((?:^[-+])?\d{1,3})(?=(?:\d\d\d)+(?!\d))/g, '$1,');
document.form1.field1.value = SetVal ; // 小計を表示

// 商品2
var price2 = document.form1.goods2.selectedIndex * 1000; // 単価を設定
SetVal = String(price2);
SetVal = SetVal.replace( /,/g, '').replace( /((?:^[-+])?\d{1,3})(?=(?:\d\d\d)+(?!\d))/g, '$1,');
document.form1.field2.value = SetVal ; // 小計を表示

// 商品3
var price3 = document.form1.goods3.selectedIndex * 3000; // 単価を設定
SetVal = String(price3);
SetVal = SetVal.replace( /,/g, '').replace( /((?:^[-+])?\d{1,3})(?=(?:\d\d\d)+(?!\d))/g, '$1,');
document.form1.field3.value = SetVal ; // 小計を表示

// 合計を計算
var total = price1 + price2 + price3;
SetVal = String(total);
SetVal = SetVal.replace( /,/g, '').replace( /((?:^[-+])?\d{1,3})(?=(?:\d\d\d)+(?!\d))/g, '$1,');

// 設定終了

document.form1.field_total.value = SetVal; // 合計を表示

}

7   名前: naokun : 2007/02/02(金) 15:31  ID:qYaxPHkv sub-Q5
あ、ちょっと訂正。

>4 匿名さんのコードで

「4 匿名さんのコードを参考にして」
と置き換えてください。

8   名前: しんぺ : 2007/02/02(金) 15:31  ID:dXGkpcm1 sub-t1
匿名さん
naokunさん

ありがとうございます!
理解が足りずすみません。
お二人のおかげで総額部分の表示はできました。

ちょっと自分のところのが改造してあって個別小計がまだうまくいきませんが、
もう少し勉強しつつクリア目指します。
本当に助かりました。

>>匿名さん
自分が理解できてないのに質問下手でごめんなさい。ありがとうございました。

一覧へ戻る