質問するログイン新規登録

回答編集履歴

1

元のコードを修正してみました。

2020/07/19 03:39

投稿

Jon_do
Jon_do

スコア1373

answer CHANGED
@@ -1,4 +1,5 @@
1
- 自分ならこうするという実例です
1
+ まずは自分ならこうするという実例です
2
+ <script>
2
3
  //整数をチェックする関数
3
4
  const checkNum = () => {
4
5
  //クリックされた時点でのfizzに入力された値
@@ -12,4 +13,73 @@
12
13
  //クリック時の処理
13
14
  btn.addEventListener('click', () => {
14
15
  checkNum();
15
- }, false);
16
+ }, false);
17
+ </script>
18
+
19
+ /*追記*/
20
+ 元のコードを修正してみました。
21
+
22
+ <script>
23
+ //inputのidを取得
24
+ const fizzNum = document.getElementById('fizz');
25
+
26
+ //整数をチェックする関数
27
+ function isNumber(numVal) {
28
+
29
+ /*
30
+
31
+ * var pattern = /^[-]?([1-9]\d*|0)(.\d+)?$/;
32
+
33
+ 1つ目の間違いはここです。これでは整数ではなく
34
+ 少数や-1なども許可してしまいます。ほかの方も言っている通り
35
+ 整数の定義によりますが、今回は半角かつ整数の数字のみ、001などは
36
+ 許容しないようにしてみました。
37
+ ※varはなるべく使わないほうが良いのでconstにしました。
38
+
39
+ */
40
+
41
+ const pattern = /^([1-9]\d*|0)$/;
42
+
43
+ /*
44
+
45
+ * return pattern.test(numVal);
46
+
47
+ 二つ目の間違いはここです。
48
+ これでは、fizzNumを参照してしまい、
49
+ 入力した値は参照されません。
50
+ 入力した値を参照するため .valueを追加します。
51
+
52
+ */
53
+
54
+ return pattern.test(numVal.value);
55
+
56
+ }
57
+
58
+ /*
59
+
60
+ * //戻り値を変数に格納
61
+ * let integerCheck = isNumber(fizzNum);
62
+
63
+ ここが最後の間違いです。これでは入力する前にisNumber関数を
64
+ 実行してしまいます。そのためここは記述自体を削除します。
65
+
66
+ */
67
+
68
+ //クリック時の処理
69
+ btn.addEventListener('click', () => {
70
+
71
+ /*
72
+ クリックした時点でisNumber関数を実行するため
73
+ 下記にintegerCheckを移動しました。※letである必要はないのでconstにしました。
74
+ */
75
+
76
+ const integerCheck = isNumber(fizzNum);
77
+
78
+ if (integerCheck == true) {
79
+ alert('整数値です');
80
+ } else if (integerCheck == false) {
81
+ alert('整数値ではありません');
82
+ }
83
+ }, false);
84
+
85
+ </script>