回答編集履歴
2
追記
answer
CHANGED
|
@@ -33,6 +33,7 @@
|
|
|
33
33
|
|
|
34
34
|
※イベント発生度合いから最初のコードで提示したonkeypressではなくonkeyupに変更しています。
|
|
35
35
|
単に計算しているだけの機能なのでメソッド名もpriceからcalcに変更しています。
|
|
36
|
+
※片方が入力されなかった場合や半角数値ではなかった場合などは考慮していません。本当にミニマム構成です。
|
|
36
37
|
|
|
37
38
|
**これをそのままいきなりやろうとしていることに当てはめようとしないでください。
|
|
38
39
|
「関数を１つでやりきるためのヒント・考え方」の１つとして捉えてください。
|
|
@@ -58,4 +59,10 @@
|
|
|
58
59
|
var resField = document.getElementById(res);
|
|
59
60
|
resField.textContent = ca1+ca2;
|
|
60
61
|
}
|
|
61
|
-
```
|
|
62
|
+
```
|
|
63
|
+
|
|
64
|
+
「そっくりそのまま使えるコード」をもらっても理解できないままそのコードを以て丸投げ質問している人も多いです。それはコードを提示してくれた人にも失礼ですし、はっきり言うと迷惑です（この質問者さんがそうというわけではないですがそうなる恐れがあります）。
|
|
65
|
+
理解できてないなら解決済みにしないようにしてくださいね。
|
|
66
|
+
|
|
67
|
+
まずは提示された回答のコードをきちんと理解するところから。
|
|
68
|
+
すべてのコードは１つ１つ意味がありますし、意味を持たせたコードを組まなければなりません。
|
1
修正
answer
CHANGED
|
@@ -23,4 +23,39 @@
|
|
|
23
23
|
とすると入力値がとれます。
|
|
24
24
|
|
|
25
25
|
|
|
26
|
-
ヒントになれば幸いです。
|
|
26
|
+
ヒントになれば幸いです。
|
|
27
|
+
|
|
28
|
+
# ミニマムサンプルコード
|
|
29
|
+
|
|
30
|
+
「左の値と右の値を足した結果をその隣のフィールドに表示」というミニマムサンプルコードです。
|
|
31
|
+
幾つフォームのセットが増えても関数は１つで左右与えられる情報の型が違っても（Elementそのものとフィールド名）
|
|
32
|
+
関係なく計算ができているのがわかると思います。
|
|
33
|
+
|
|
34
|
+
※イベント発生度合いから最初のコードで提示したonkeypressではなくonkeyupに変更しています。
|
|
35
|
+
単に計算しているだけの機能なのでメソッド名もpriceからcalcに変更しています。
|
|
36
|
+
|
|
37
|
+
**これをそのままいきなりやろうとしていることに当てはめようとしないでください。
|
|
38
|
+
「関数を１つでやりきるためのヒント・考え方」の１つとして捉えてください。
|
|
39
|
+
おそらくこの考え方を理解できないとこの質問でやろうとしていることは実現不可能と思ってください。**
|
|
40
|
+
|
|
41
|
+
```html
|
|
42
|
+
<input type="text" name="a1" id="a1" onkeyup="calc(this,'b1','result1')">＋
|
|
43
|
+
<input type="text" name="b1" id="b1" onkeyup="calc(this,'a1','result1')">＝
|
|
44
|
+
<span id="result1"></span>
|
|
45
|
+
<br />
|
|
46
|
+
<input type="text" name="a2" id="a2" onkeyup="calc(this,'b2','result2')">＋
|
|
47
|
+
<input type="text" name="b2" id="b2" onkeyup="calc(this,'a2','result2')">＝
|
|
48
|
+
<span id="result2"></span>
|
|
49
|
+
<br />
|
|
50
|
+
<input type="text" name="a3" id="a3" onkeyup="calc(this,'b3','result3')">＋
|
|
51
|
+
<input type="text" name="b3" id="b3" onkeyup="calc(this,'a3','result3')">＝
|
|
52
|
+
<span id="result3"></span>
|
|
53
|
+
```
|
|
54
|
+
```js
|
|
55
|
+
function calc(calc1,calc2,res){
|
|
56
|
+
var ca1 = parseInt(calc1.value);
|
|
57
|
+
var ca2 = parseInt(document.getElementById(calc2).value);
|
|
58
|
+
var resField = document.getElementById(res);
|
|
59
|
+
resField.textContent = ca1+ca2;
|
|
60
|
+
}
|
|
61
|
+
```
|