回答編集履歴

1

追記

2018/05/17 05:33

投稿

yambejp
yambejp

スコア114825

test CHANGED
@@ -7,3 +7,219 @@
7
7
  priceとfieldを多用していますが、
8
8
 
9
9
  たとえば各要素にidをふるなどもう少し工夫が必要かと
10
+
11
+
12
+
13
+ # sample
14
+
15
+
16
+
17
+ 最大限元のHTMLを優先してみました
18
+
19
+
20
+
21
+ ```javascript
22
+
23
+ <script>
24
+
25
+ document.addEventListener('change',function(e){
26
+
27
+ var p=document.querySelectorAll('input[name=price]');
28
+
29
+ var f=document.querySelectorAll('input[name=field]');
30
+
31
+ var w=document.querySelectorAll('input[type=radio].which:checked');
32
+
33
+ var c=document.querySelectorAll('select[name=count]');
34
+
35
+ var t=document.querySelectorAll('input[name=field_total]');
36
+
37
+ var ta=document.querySelector('input[name=allTotal]');
38
+
39
+ var t0=0,t1=0;
40
+
41
+ var v=0;
42
+
43
+ for(var i=0;i<3;i++){
44
+
45
+ t0+=(v=parseInt(p[i].value)||0*parseInt(w[i].value||0));
46
+
47
+ f[i].value=p[i].value==""?"":v;
48
+
49
+ t1+=(v=parseInt(p[i+3].value||0)*parseInt(c[i].value||0));
50
+
51
+ f[i+3].value=p[i+3].value==""?"":v;
52
+
53
+ }
54
+
55
+ t[0].value=t0;
56
+
57
+ t[1].value=t1;
58
+
59
+ ta.value=t0+t1;
60
+
61
+ });
62
+
63
+ </script>
64
+
65
+ <form id="form">
66
+
67
+ <table>
68
+
69
+ <tr>
70
+
71
+ <th>単価</th>
72
+
73
+ <th>利用区分</th>
74
+
75
+ <th>合計</th>
76
+
77
+ </tr>
78
+
79
+ <tr>
80
+
81
+ <td><input maxlength='6' type="text" name="price"></td>
82
+
83
+ <td><label><input type="radio" class="which" name="which_1" value="1" checked>片道
84
+
85
+ <input type="radio" class="which" name="which_1" value="2">往復</label></td>
86
+
87
+ <td><input maxlength='7' type="text" name="field"></td>
88
+
89
+ </tr>
90
+
91
+ <tr>
92
+
93
+ <td><input maxlength='6' type="text" name="price"></td>
94
+
95
+ <td><label><input type="radio" class="which" name="which_2" value="1" checked>片道
96
+
97
+ <input type="radio" class="which" name="which_2" value="2">往復</label></td>
98
+
99
+ <td><input maxlength='7' type="text" name="field"></td>
100
+
101
+ </tr>
102
+
103
+ <tr>
104
+
105
+ <td><input maxlength='6' type="text" name="price"></td>
106
+
107
+ <td><label><input type="radio" class="which" name="which_3" value="1" checked>片道
108
+
109
+ <input type="radio" class="which" name="which_3" value="2">往復</label></td>
110
+
111
+ <td><input maxlength='7' type="text" name="field"></td>
112
+
113
+ </tr>
114
+
115
+ <tr>
116
+
117
+ <td align="right" colspan="3">合計</td>
118
+
119
+ <td><input type="text" name="field_total" value="0"></td>
120
+
121
+ </tr>
122
+
123
+ </table>
124
+
125
+ <table>
126
+
127
+ <tr>
128
+
129
+ <th>単価</th>
130
+
131
+ <th>数量</th>
132
+
133
+ <th>合計</th>
134
+
135
+ </tr>
136
+
137
+ <tr>
138
+
139
+ <td><input maxlength='6' type="text" name="price"></td>
140
+
141
+ <td class="left">
142
+
143
+ <select name="count">
144
+
145
+ <?php
146
+
147
+ $price=[0,1,2,3,4,5,6,7,8,9,10];
148
+
149
+ foreach($price as $item) {
150
+
151
+ echo '<option value="', $item ,'">', $item ,'</option>';}
152
+
153
+ ?>
154
+
155
+ </select></td>
156
+
157
+ <td><input maxlength='7' type="text" name="field"></td>
158
+
159
+ </tr>
160
+
161
+ <tr>
162
+
163
+ <td><input maxlength='6' type="text" name="price"></td>
164
+
165
+ <td class="left">
166
+
167
+ <select name="count">
168
+
169
+ <?php
170
+
171
+ $price=[0,1,2,3,4,5,6,7,8,9,10];
172
+
173
+ foreach($price as $item) {
174
+
175
+ echo '<option value="', $item ,'">', $item ,'</option>';}
176
+
177
+ ?>
178
+
179
+ </select></td>
180
+
181
+ <td><input maxlength='7' type="text" name="field"></td>
182
+
183
+ </tr>
184
+
185
+ <tr>
186
+
187
+ <td><input maxlength='6' type="text" name="price"></td>
188
+
189
+ <td class="left">
190
+
191
+ <select name="count">
192
+
193
+ <?php
194
+
195
+ $price=[0,1,2,3,4,5,6,7,8,9,10];
196
+
197
+ foreach($price as $item) {
198
+
199
+ echo '<option value="', $item ,'">', $item ,'</option>';}
200
+
201
+ ?>
202
+
203
+ </select></td>
204
+
205
+ <td><input maxlength='7' type="text" name="field"></td>
206
+
207
+ </tr>
208
+
209
+ <tr>
210
+
211
+ <td align="right" colspan="3">合計</td>
212
+
213
+ <td><input type="text" name="field_total" value="0"></td>
214
+
215
+ </tr>
216
+
217
+ </table>
218
+
219
+ <label>総合計</label>
220
+
221
+ <input type="text" name="allTotal">
222
+
223
+ </body>
224
+
225
+ ```