JavaScript　選択肢の中で選んだ値を隣に表示

解決済

質問者：mihomama84
質問日時：2009/09/08 15:57
回答数：1件

いつもお世話になっております。

JavaScriptの質問なのですが、
選択肢を選んだときに、その選んだ値の値段だけを
下に表示したいのですが、
JavaScriptがわからず困っています・・・。

選択肢：　アメ（￥30）
　　　　　チップス（￥150）
　　　　　ジュース（￥120）
　　　　　おつまみ（￥250）

の時にジュースを選択したとき
選択肢の下に　￥120
を表示したいのです。

どなたかご存知の方、　ご教授お願いします！

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (1件)

ベストアンサー優先
最新から表示
回答順に表示

No.1ベストアンサー

回答者： fujillin
回答日時：2009/09/08 16:43

選択肢をどうやって選択させるつもりなのかなどいろいろ不明ですが、とりあえずこんな感じ？

（複数選択を許さない場合は、multiple設定をはずしてください）

<html>
<head>
<script type="text/javascript">
function calc(elm) {
var i, v = 0, o = elm.options;
for (i=0; i<o.length; i++) if (o[i].selected) v += parseInt(o[i].value);
document.getElementById('total').innerHTML = '￥' + v;
}
</script>
</head>

<body>
<select size=5 multiple onchange="calc(this)">
<option value="30">アメ（￥30）
<option value="150">チップス（￥150）
<option value="120">ジュース（￥120）
<option value="250">おつまみ（￥250）
</select>
<p>
合計：<span id="total"></span>
</body>
</html>