質問編集履歴

1

code入力

2021/11/10 03:56

投稿

m.aru8
m.aru8

スコア2

test CHANGED
File without changes
test CHANGED
@@ -1,4 +1,426 @@
1
+ ```<!DOCTYPE html>
2
+
3
+ <meta charset="UTF-8">
4
+
5
+ <html><body>
6
+
7
+ <head>
8
+
9
+ <link href="style.css" rel="stylesheet">
10
+
11
+ <script src="main.js"></script>
12
+
13
+ </head>
14
+
15
+ <header>
16
+
17
+ <a href="/dentaku.html"><span class="kh">たしざん</span></a>
18
+
19
+ <a href="./hikizan.html">ひきざん</a><br><br>
20
+
21
+ </header>
22
+
23
+ <!--計算表の始まり-->
24
+
25
+ <div class="yoko"><div>
26
+
27
+ <from name="fromR"><input style="width:100px;height:100px;font-size:100px; text-align: right; "id="tx1" /></from></div>
28
+
29
+ <div><h1> + </h1></div>
30
+
31
+ <div><input style="width:100px;height:100px;font-size:100px; text-align: right;"id="tx2" /><br /> </div>
32
+
33
+ </div>
34
+
35
+ </span>
36
+
37
+ <!--計算表の終わり-->
38
+
39
+
40
+
41
+
42
+
43
+
44
+
45
+ <!--りんご画像の横並びの始まり-->
46
+
47
+
48
+
49
+ <style>
50
+
51
+ .yoko{
52
+
53
+ display:flex;
54
+
55
+ }
56
+
57
+ .yoko>div{
58
+
59
+ width:auto;
60
+
61
+ }
62
+
63
+ </style>
64
+
65
+
66
+
67
+ <!--りんご画像の横並びの終わり-->
68
+
69
+
70
+
71
+ <!--りんご非表示待機の始まり-->
72
+
73
+ <div class="yoko">
74
+
75
+ <div>
76
+
77
+  <!--1個-->
78
+
79
+ <img src="irasuto/ringo1.png" id="r1" width="40px"></div>
80
+
81
+  <!--2個-->
82
+
83
+ <div><div id="r2">
84
+
85
+ <img src="irasuto/ringo1.png" width="40px">
86
+
87
+ <img src="irasuto/ringo1.png" width="40px"></div></div>
88
+
89
+  <!--3個-->
90
+
91
+ <div><div id="r3">
92
+
93
+ <img src="irasuto/ringo1.png" width="40px">
94
+
95
+ <img src="irasuto/ringo1.png" width="40px">
96
+
97
+ <img src="irasuto/ringo1.png" width="40px"></div></div>
98
+
99
+  <!--4個-->
100
+
101
+ <div><div id="r4">
102
+
103
+ <img src="irasuto/ringo1.png" width="40px">
104
+
105
+ <img src="irasuto/ringo1.png" width="40px">
106
+
107
+ <img src="irasuto/ringo1.png" width="40px">
108
+
109
+ <img src="irasuto/ringo1.png" width="40px"></div></div>
110
+
111
+  <!--5個-->
112
+
113
+ <div><div id="r5">
114
+
115
+ <img src="irasuto/ringo1.png" width="40px">
116
+
117
+ <img src="irasuto/ringo1.png" width="40px">
118
+
119
+ <img src="irasuto/ringo1.png" width="40px">
120
+
121
+ <img src="irasuto/ringo1.png" width="40px">
122
+
123
+ <img src="irasuto/ringo1.png" width="40px"></div></div>
124
+
125
+  <!--6個-->
126
+
127
+ <div><div id="r6">
128
+
129
+ <img src="irasuto/ringo1.png" width="40px">
130
+
131
+ <img src="irasuto/ringo1.png" width="40px">
132
+
133
+ <img src="irasuto/ringo1.png" width="40px">
134
+
135
+ <img src="irasuto/ringo1.png" width="40px">
136
+
137
+ <img src="irasuto/ringo1.png" width="40px">
138
+
139
+ <img src="irasuto/ringo1.png" width="40px"></div></div>
140
+
141
+  <!--7個-->
142
+
143
+ <div><div id="r7">
144
+
145
+ <img src="irasuto/ringo1.png" width="40px">
146
+
147
+ <img src="irasuto/ringo1.png" width="40px">
148
+
149
+ <img src="irasuto/ringo1.png" width="40px">
150
+
151
+ <img src="irasuto/ringo1.png" width="40px">
152
+
153
+ <img src="irasuto/ringo1.png" width="40px">
154
+
155
+ <img src="irasuto/ringo1.png" width="40px">
156
+
157
+ <img src="irasuto/ringo1.png" width="40px"></div></div>
158
+
159
+  <!--8個-->
160
+
161
+ <div><div id="r8">
162
+
163
+ <img src="irasuto/ringo1.png" width="40px">
164
+
165
+ <img src="irasuto/ringo1.png" width="40px">
166
+
167
+ <img src="irasuto/ringo1.png" width="40px">
168
+
169
+ <img src="irasuto/ringo1.png" width="40px">
170
+
171
+ <img src="irasuto/ringo1.png" width="40px">
172
+
173
+ <img src="irasuto/ringo1.png" width="40px">
174
+
175
+ <img src="irasuto/ringo1.png" width="40px">
176
+
177
+ <img src="irasuto/ringo1.png" width="40px"></div></div>
178
+
179
+  <!--9個-->
180
+
181
+ <div><div id="r9">
182
+
183
+ <img src="irasuto/ringo1.png" width="40px">
184
+
185
+ <img src="irasuto/ringo1.png" width="40px">
186
+
187
+ <img src="irasuto/ringo1.png" width="40px">
188
+
189
+ <img src="irasuto/ringo1.png" width="40px">
190
+
191
+ <img src="irasuto/ringo1.png" width="40px">
192
+
193
+ <img src="irasuto/ringo1.png" width="40px">
194
+
195
+ <img src="irasuto/ringo1.png" width="40px">
196
+
197
+ <img src="irasuto/ringo1.png" width="40px">
198
+
199
+ <img src="irasuto/ringo1.png" width="40px"></div></div>
200
+
201
+
202
+
203
+ </div>
204
+
205
+ <!--りんご非表示待機の終わり-->
206
+
207
+
208
+
209
+ <!--りんご表示切り替え+数字入力の始まり-->
210
+
211
+
212
+
213
+  <!--1表示-->
214
+
215
+ <input type="button" value="- 1 -"onclick="document.getElementById('r1').
216
+
217
+ style.visibility='visible';append('1')">
218
+
219
+ <!--2表示-->
220
+
221
+ <input type="button" value="- 2 -"onclick="document.getElementById('r2').
222
+
223
+ style.visibility='visible';append('2')">
224
+
225
+ <!--3表示-->
226
+
227
+ <input type="button" value="- 3 -"onclick="document.getElementById('r3').
228
+
229
+ style.visibility='visible';append('3')">
230
+
231
+ <!--4表示-->
232
+
233
+ <input type="button" value="- 4 -"onclick="document.getElementById('r4').
234
+
235
+ style.visibility='visible';append('4')">
236
+
237
+ <!--5表示-->
238
+
239
+ <input type="button" value="- 5 -"onclick="document.getElementById('r5').
240
+
241
+ style.visibility='visible';append('5')">
242
+
243
+ <!--6表示-->
244
+
245
+ <input type="button" value="- 6 -"onclick="document.getElementById('r6').
246
+
247
+ style.visibility='visible';append('6')">
248
+
249
+ <!--7表示-->
250
+
251
+ <input type="button" value="- 7 -"onclick="document.getElementById('r7').
252
+
253
+ style.visibility='visible';append('7')">
254
+
255
+ <!--8表示-->
256
+
257
+ <input type="button" value="- 8 -"onclick="document.getElementById('r8').
258
+
259
+ style.visibility='visible';append('8')">
260
+
261
+ <!--9表示-->
262
+
263
+ <input type="button" value="- 9 -"onclick="document.getElementById('r9').
264
+
265
+ style.visibility='visible';append('9')">
266
+
267
+
268
+
269
+ <!--りんご表示切り替え+数字入力の終わり-->
270
+
271
+
272
+
273
+ <!--演算式の始まり-->
274
+
275
+
276
+
277
+ <script>
278
+
279
+
280
+
281
+ function update( _v ) // input tag を更新する関数
282
+
283
+ {
284
+
285
+ document.querySelector( 'input' ).value = _v
286
+
287
+ }
288
+
289
+
290
+
291
+ function append( _v ) // 数字ボタンが押されたので数字を後ろに追加する
292
+
293
+ {
294
+
295
+ document.querySelector( 'input' ).value += _v
296
+
297
+ }
298
+
299
+
300
+
301
+ function update( _n ) // input tag を更新する関数
302
+
303
+ {
304
+
305
+ document.querySelector( 'input' ).value = _n
306
+
307
+ }
308
+
309
+
310
+
311
+ function append( _n ) // 数字ボタンが押されたので数字を後ろに追加する
312
+
313
+ {
314
+
315
+ document.querySelector( 'input' ).value += _n
316
+
317
+ }
318
+
319
+
320
+
321
+ function calc() // 「=」ボタンが押されたので計算する
322
+
323
+ {
324
+
325
+ const v = document.querySelector( 'input' ).value
326
+
327
+ const n = document.querySelector( 'input' ).value
328
+
329
+ try {
330
+
331
+ const f = new Function( 'return ' + v )
332
+
333
+ update( f().toString() )
334
+
335
+ } catch( _error ) {
336
+
337
+ update( _error ) // 計算に失敗した場合は、そのエラーの内容を表示する
338
+
339
+
340
+
341
+ }
342
+
343
+
344
+
345
+ var input = document.getElementById(_v)
346
+
347
+ var count = input.value.length
348
+
349
+ console.log(count)
350
+
351
+ }
352
+
353
+ </script>
354
+
355
+
356
+
357
+ <!--演算式の終わり-->
358
+
359
+
360
+
361
+ <!--”=+ー”の表示始まり-->
362
+
363
+
364
+
365
+ <button onclick="append( '+' )" >+</button>
366
+
367
+ <button onclick="append( '-' )" >-</button>
368
+
369
+ <button onclick="calc()" style="width:105px;">=</button>
370
+
371
+
372
+
373
+ <!--”=+ー”の表示の終わり-->
374
+
375
+
376
+
377
+ <!--CLRボタンの始まり-->
378
+
379
+
380
+
381
+ <!--りんご非表示-->
382
+
383
+ <input type="button"value="CLR"onclick="
384
+
385
+ document.getElementById('r1').style.visibility='hidden';
386
+
387
+ document.getElementById('r2').style.visibility='hidden';
388
+
389
+ document.getElementById('r3').style.visibility='hidden';
390
+
391
+ document.getElementById('r4').style.visibility='hidden';
392
+
393
+ document.getElementById('r5').style.visibility='hidden';
394
+
395
+ document.getElementById('r6').style.visibility='hidden';
396
+
397
+ document.getElementById('r7').style.visibility='hidden';
398
+
399
+ document.getElementById('r8').style.visibility='hidden';
400
+
401
+ document.getElementById('r9').style.visibility='hidden';
402
+
403
+
404
+
405
+ //数字非表示
406
+
407
+ update('')">
408
+
409
+
410
+
411
+ <!--CLRボタンの終わり-->
412
+
413
+
414
+
415
+ </body></html>
416
+
417
+
418
+
419
+ コード
420
+
421
+ ```
422
+
1
- ### 前提・実現したいこと
423
+ ```### 前提・実現したいこと
2
424
 
3
425
  電卓での1桁入力
4
426
 
@@ -20,426 +442,6 @@
20
442
 
21
443
 
22
444
 
23
- ### 該当のソースコード
24
-
25
- <!DOCTYPE html>
26
-
27
- <meta charset="UTF-8">
28
-
29
- <html><body>
30
-
31
- <head>
32
-
33
- <link href="style.css" rel="stylesheet">
34
-
35
- <script src="main.js"></script>
36
-
37
- </head>
38
-
39
- <header>
40
-
41
- <a href="/dentaku.html"><span class="kh">たしざん</span></a>
42
-
43
- <a href="./hikizan.html">ひきざん</a><br><br>
44
-
45
- </header>
46
-
47
- <!--計算表の始まり-->
48
-
49
- <div class="yoko"><div>
50
-
51
- <from name="fromR"><input style="width:100px;height:100px;font-size:100px; text-align: right; "id="tx1" /></from></div>
52
-
53
- <div><h1> + </h1></div>
54
-
55
- <div><input style="width:100px;height:100px;font-size:100px; text-align: right;"id="tx2" /><br /> </div>
56
-
57
- </div>
58
-
59
- </span>
60
-
61
- <!--計算表の終わり-->
62
-
63
-
64
-
65
-
66
-
67
-
68
-
69
- <!--りんご画像の横並びの始まり-->
70
-
71
-
72
-
73
- <style>
74
-
75
- .yoko{
76
-
77
- display:flex;
78
-
79
- }
80
-
81
- .yoko>div{
82
-
83
- width:auto;
84
-
85
- }
86
-
87
- </style>
88
-
89
-
90
-
91
- <!--りんご画像の横並びの終わり-->
92
-
93
-
94
-
95
- <!--りんご非表示待機の始まり-->
96
-
97
- <div class="yoko">
98
-
99
- <div>
100
-
101
-  <!--1個-->
102
-
103
- <img src="irasuto/ringo1.png" id="r1" width="40px"></div>
104
-
105
-  <!--2個-->
106
-
107
- <div><div id="r2">
108
-
109
- <img src="irasuto/ringo1.png" width="40px">
110
-
111
- <img src="irasuto/ringo1.png" width="40px"></div></div>
112
-
113
-  <!--3個-->
114
-
115
- <div><div id="r3">
116
-
117
- <img src="irasuto/ringo1.png" width="40px">
118
-
119
- <img src="irasuto/ringo1.png" width="40px">
120
-
121
- <img src="irasuto/ringo1.png" width="40px"></div></div>
122
-
123
-  <!--4個-->
124
-
125
- <div><div id="r4">
126
-
127
- <img src="irasuto/ringo1.png" width="40px">
128
-
129
- <img src="irasuto/ringo1.png" width="40px">
130
-
131
- <img src="irasuto/ringo1.png" width="40px">
132
-
133
- <img src="irasuto/ringo1.png" width="40px"></div></div>
134
-
135
-  <!--5個-->
136
-
137
- <div><div id="r5">
138
-
139
- <img src="irasuto/ringo1.png" width="40px">
140
-
141
- <img src="irasuto/ringo1.png" width="40px">
142
-
143
- <img src="irasuto/ringo1.png" width="40px">
144
-
145
- <img src="irasuto/ringo1.png" width="40px">
146
-
147
- <img src="irasuto/ringo1.png" width="40px"></div></div>
148
-
149
-  <!--6個-->
150
-
151
- <div><div id="r6">
152
-
153
- <img src="irasuto/ringo1.png" width="40px">
154
-
155
- <img src="irasuto/ringo1.png" width="40px">
156
-
157
- <img src="irasuto/ringo1.png" width="40px">
158
-
159
- <img src="irasuto/ringo1.png" width="40px">
160
-
161
- <img src="irasuto/ringo1.png" width="40px">
162
-
163
- <img src="irasuto/ringo1.png" width="40px"></div></div>
164
-
165
-  <!--7個-->
166
-
167
- <div><div id="r7">
168
-
169
- <img src="irasuto/ringo1.png" width="40px">
170
-
171
- <img src="irasuto/ringo1.png" width="40px">
172
-
173
- <img src="irasuto/ringo1.png" width="40px">
174
-
175
- <img src="irasuto/ringo1.png" width="40px">
176
-
177
- <img src="irasuto/ringo1.png" width="40px">
178
-
179
- <img src="irasuto/ringo1.png" width="40px">
180
-
181
- <img src="irasuto/ringo1.png" width="40px"></div></div>
182
-
183
-  <!--8個-->
184
-
185
- <div><div id="r8">
186
-
187
- <img src="irasuto/ringo1.png" width="40px">
188
-
189
- <img src="irasuto/ringo1.png" width="40px">
190
-
191
- <img src="irasuto/ringo1.png" width="40px">
192
-
193
- <img src="irasuto/ringo1.png" width="40px">
194
-
195
- <img src="irasuto/ringo1.png" width="40px">
196
-
197
- <img src="irasuto/ringo1.png" width="40px">
198
-
199
- <img src="irasuto/ringo1.png" width="40px">
200
-
201
- <img src="irasuto/ringo1.png" width="40px"></div></div>
202
-
203
-  <!--9個-->
204
-
205
- <div><div id="r9">
206
-
207
- <img src="irasuto/ringo1.png" width="40px">
208
-
209
- <img src="irasuto/ringo1.png" width="40px">
210
-
211
- <img src="irasuto/ringo1.png" width="40px">
212
-
213
- <img src="irasuto/ringo1.png" width="40px">
214
-
215
- <img src="irasuto/ringo1.png" width="40px">
216
-
217
- <img src="irasuto/ringo1.png" width="40px">
218
-
219
- <img src="irasuto/ringo1.png" width="40px">
220
-
221
- <img src="irasuto/ringo1.png" width="40px">
222
-
223
- <img src="irasuto/ringo1.png" width="40px"></div></div>
224
-
225
-
226
-
227
- </div>
228
-
229
- <!--りんご非表示待機の終わり-->
230
-
231
-
232
-
233
- <!--りんご表示切り替え+数字入力の始まり-->
234
-
235
-
236
-
237
-  <!--1表示-->
238
-
239
- <input type="button" value="- 1 -"onclick="document.getElementById('r1').
240
-
241
- style.visibility='visible';append('1')">
242
-
243
- <!--2表示-->
244
-
245
- <input type="button" value="- 2 -"onclick="document.getElementById('r2').
246
-
247
- style.visibility='visible';append('2')">
248
-
249
- <!--3表示-->
250
-
251
- <input type="button" value="- 3 -"onclick="document.getElementById('r3').
252
-
253
- style.visibility='visible';append('3')">
254
-
255
- <!--4表示-->
256
-
257
- <input type="button" value="- 4 -"onclick="document.getElementById('r4').
258
-
259
- style.visibility='visible';append('4')">
260
-
261
- <!--5表示-->
262
-
263
- <input type="button" value="- 5 -"onclick="document.getElementById('r5').
264
-
265
- style.visibility='visible';append('5')">
266
-
267
- <!--6表示-->
268
-
269
- <input type="button" value="- 6 -"onclick="document.getElementById('r6').
270
-
271
- style.visibility='visible';append('6')">
272
-
273
- <!--7表示-->
274
-
275
- <input type="button" value="- 7 -"onclick="document.getElementById('r7').
276
-
277
- style.visibility='visible';append('7')">
278
-
279
- <!--8表示-->
280
-
281
- <input type="button" value="- 8 -"onclick="document.getElementById('r8').
282
-
283
- style.visibility='visible';append('8')">
284
-
285
- <!--9表示-->
286
-
287
- <input type="button" value="- 9 -"onclick="document.getElementById('r9').
288
-
289
- style.visibility='visible';append('9')">
290
-
291
-
292
-
293
- <!--りんご表示切り替え+数字入力の終わり-->
294
-
295
-
296
-
297
- <!--演算式の始まり-->
298
-
299
-
300
-
301
- <script>
302
-
303
-
304
-
305
- function update( _v ) // input tag を更新する関数
306
-
307
- {
308
-
309
- document.querySelector( 'input' ).value = _v
310
-
311
- }
312
-
313
-
314
-
315
- function append( _v ) // 数字ボタンが押されたので数字を後ろに追加する
316
-
317
- {
318
-
319
- document.querySelector( 'input' ).value += _v
320
-
321
- }
322
-
323
-
324
-
325
- function update( _n ) // input tag を更新する関数
326
-
327
- {
328
-
329
- document.querySelector( 'input' ).value = _n
330
-
331
- }
332
-
333
-
334
-
335
- function append( _n ) // 数字ボタンが押されたので数字を後ろに追加する
336
-
337
- {
338
-
339
- document.querySelector( 'input' ).value += _n
340
-
341
- }
342
-
343
-
344
-
345
- function calc() // 「=」ボタンが押されたので計算する
346
-
347
- {
348
-
349
- const v = document.querySelector( 'input' ).value
350
-
351
- const n = document.querySelector( 'input' ).value
352
-
353
- try {
354
-
355
- const f = new Function( 'return ' + v )
356
-
357
- update( f().toString() )
358
-
359
- } catch( _error ) {
360
-
361
- update( _error ) // 計算に失敗した場合は、そのエラーの内容を表示する
362
-
363
-
364
-
365
- }
366
-
367
-
368
-
369
- var input = document.getElementById(_v)
370
-
371
- var count = input.value.length
372
-
373
- console.log(count)
374
-
375
- }
376
-
377
- </script>
378
-
379
-
380
-
381
- <!--演算式の終わり-->
382
-
383
-
384
-
385
- <!--”=+ー”の表示始まり-->
386
-
387
-
388
-
389
- <button onclick="append( '+' )" >+</button>
390
-
391
- <button onclick="append( '-' )" >-</button>
392
-
393
- <button onclick="calc()" style="width:105px;">=</button>
394
-
395
-
396
-
397
- <!--”=+ー”の表示の終わり-->
398
-
399
-
400
-
401
- <!--CLRボタンの始まり-->
402
-
403
-
404
-
405
- <!--りんご非表示-->
406
-
407
- <input type="button"value="CLR"onclick="
408
-
409
- document.getElementById('r1').style.visibility='hidden';
410
-
411
- document.getElementById('r2').style.visibility='hidden';
412
-
413
- document.getElementById('r3').style.visibility='hidden';
414
-
415
- document.getElementById('r4').style.visibility='hidden';
416
-
417
- document.getElementById('r5').style.visibility='hidden';
418
-
419
- document.getElementById('r6').style.visibility='hidden';
420
-
421
- document.getElementById('r7').style.visibility='hidden';
422
-
423
- document.getElementById('r8').style.visibility='hidden';
424
-
425
- document.getElementById('r9').style.visibility='hidden';
426
-
427
-
428
-
429
- //数字非表示
430
-
431
- update('')">
432
-
433
-
434
-
435
- <!--CLRボタンの終わり-->
436
-
437
-
438
-
439
- </body></html>
440
-
441
-
442
-
443
445
  ### 試したこと
444
446
 
445
447
  javascript