回答編集履歴
4
コード修正
answer
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
`#counter` を`<input type=number>`にするとシンプルになるのではないでしょうか。
|
|
2
2
|
```html
|
|
3
|
-
<input id="counter" type="number" min="0" max="500" value="0" readonly style="border:none
|
|
3
|
+
<input id="counter" type="number" min="0" max="500" value="0" readonly style="border:none; background:transparent;">
|
|
4
4
|
```
|
|
5
5
|
|
|
6
6
|
こうすると、ボタンクリック時は、`counter.stepDown(text.valueAsNumber)` `counter.stepUp(text.valueAsNumber)` でよいです。
|
3
typo
answer
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
`#counter` を`<input type=number>`にするとシンプルになるのではないでしょうか。
|
|
2
|
-
```
|
|
2
|
+
```html
|
|
3
3
|
<input id="counter" type="number" min="0" max="500" value="0" readonly style="border:none, background:transparent;">
|
|
4
4
|
```
|
|
5
5
|
|
2
全面改訂
answer
CHANGED
|
@@ -1,11 +1,6 @@
|
|
|
1
|
+
`#counter` を`<input type=number>`にするとシンプルになるのではないでしょうか。
|
|
1
|
-
|
|
2
|
+
```htmml
|
|
3
|
+
<input id="counter" type="number" min="0" max="500" value="0" readonly style="border:none, background:transparent;">
|
|
4
|
+
```
|
|
2
5
|
|
|
3
|
-
`text.value` は文字列なので、そのまま加減算しても期待通りにはなりません。
|
|
4
|
-
|
|
5
|
-
|
|
6
|
+
こうすると、ボタンクリック時は、`counter.stepDown(text.valueAsNumber)` `counter.stepUp(text.valueAsNumber)` でよいです。
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
```
|
|
9
|
-
<input type="number" value="1" class="counter1" max="500" min="0" id="textbox">
|
|
10
|
-
```
|
|
11
|
-
のように `data-max` `data-min` を `max` `min` に変更して、`input.stepUp()` `input.stepDown()` を使うともっとシンプルですね。
|
1
文言
answer
CHANGED
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
**↓勘違いしてました。書き直します**
|
|
2
|
+
|
|
1
3
|
`text.value` は文字列なので、そのまま加減算しても期待通りにはなりません。
|
|
2
4
|
|
|
3
5
|
`text.valueAsNumber` を読んで、`Number(text.dataset.max)` や `Number(text.dataset.min)` をチェックしつつ加減算して `text.valueAsNumber` に書き戻せばよいです。
|