回答編集履歴

6

a

2018/05/25 08:47

投稿

HayatoKamono
HayatoKamono

スコア2415

test CHANGED
@@ -8,7 +8,13 @@
8
8
 
9
9
 
10
10
 
11
- `disabled`属性の値はbool値です。
11
+ `disabled`プロパティの値はbool値です。
12
+
13
+
14
+
15
+ [https://developer.mozilla.org/ja/docs/Web/API/HTMLInputElement
16
+
17
+ ](https://developer.mozilla.org/ja/docs/Web/API/HTMLInputElement)
12
18
 
13
19
 
14
20
 

5

a

2018/05/25 08:47

投稿

HayatoKamono
HayatoKamono

スコア2415

test CHANGED
@@ -25,3 +25,67 @@
25
25
 
26
26
 
27
27
  [https://codepen.io/anon/pen/JvQyQX](https://codepen.io/anon/pen/JvQyQX)
28
+
29
+
30
+
31
+ # 参考
32
+
33
+ > 4.10.19.5 Enabling and disabling form controls: the disabled attribute
34
+
35
+ The disabled content attribute is a boolean attribute.
36
+
37
+
38
+
39
+ > A form control is disabled if its disabled attribute is set, or if it is a descendant of a fieldset element whose disabled attribute is set and is not a descendant of that fieldset element's first legend element child, if any.
40
+
41
+
42
+
43
+ > A form control that is disabled must prevent any click events that are queued on the user interaction task source from being dispatched on the element.
44
+
45
+ Constraint validation: If an element is disabled, it is barred from constraint validation.
46
+
47
+
48
+
49
+ > The disabled IDL attribute must reflect the disabled content attribute.
50
+
51
+
52
+
53
+ [https://www.w3.org/TR/2018/SPSD-html5-20180327/forms.html#concept-fe-disabled](https://www.w3.org/TR/2018/SPSD-html5-20180327/forms.html#concept-fe-disabled)
54
+
55
+
56
+
57
+ > 2.4.2 Boolean attributes
58
+
59
+ A number of attributes are boolean attributes. The presence of a boolean attribute on an element represents the true value, and the absence of the attribute represents the false value.
60
+
61
+
62
+
63
+ > If the attribute is present, its value must either be the empty string or a value that is an ASCII case-insensitive match for the attribute's canonical name, with no leading or trailing whitespace.
64
+
65
+
66
+
67
+ > The values "true" and "false" are not allowed on boolean attributes. To represent a false value, the attribute has to be omitted altogether.
68
+
69
+
70
+
71
+ > Here is an example of a checkbox that is checked and disabled. The checked and disabled attributes are the boolean attributes.
72
+
73
+ ```
74
+
75
+ <label><input type=checkbox checked name=cheese disabled> Cheese</label>
76
+
77
+ This could be equivalently written as this:
78
+
79
+
80
+
81
+ <label><input type=checkbox checked=checked name=cheese disabled=disabled> Cheese</label>
82
+
83
+ You can also mix styles; the following is still equivalent:
84
+
85
+
86
+
87
+ <label><input type='checkbox' checked name=cheese disabled=""> Cheese</label>
88
+
89
+ ```
90
+
91
+ [https://www.w3.org/TR/2018/SPSD-html5-20180327/infrastructure.html#boolean-attribute](https://www.w3.org/TR/2018/SPSD-html5-20180327/infrastructure.html#boolean-attribute)

4

https://codepen.io/anon/pen/JvQyQX

2018/05/25 08:19

投稿

HayatoKamono
HayatoKamono

スコア2415

test CHANGED
@@ -24,4 +24,4 @@
24
24
 
25
25
 
26
26
 
27
- [https://codepen.io/anon/pen/XqLaQr](https://codepen.io/anon/pen/XqLaQr)
27
+ [https://codepen.io/anon/pen/JvQyQX](https://codepen.io/anon/pen/JvQyQX)

3

https://codepen.io/anon/pen/XqLaQr?editors=1111

2018/05/25 07:25

投稿

HayatoKamono
HayatoKamono

スコア2415

test CHANGED
@@ -21,3 +21,7 @@
21
21
 
22
22
 
23
23
  もしくは、`if(hintBtn.disabled)`か、`if(!hintBtn.disabled)`です。
24
+
25
+
26
+
27
+ [https://codepen.io/anon/pen/XqLaQr](https://codepen.io/anon/pen/XqLaQr)

2

a

2018/05/25 07:20

投稿

HayatoKamono
HayatoKamono

スコア2415

test CHANGED
@@ -17,3 +17,7 @@
17
17
 
18
18
 
19
19
  正しくは、`if(hintBtn.disabled === true)`か、`if(hintBtn.disabled === false)`です。
20
+
21
+
22
+
23
+ もしくは、`if(hintBtn.disabled)`か、`if(!hintBtn.disabled)`です。

1

a

2018/05/25 07:19

投稿

HayatoKamono
HayatoKamono

スコア2415

test CHANGED
@@ -8,4 +8,12 @@
8
8
 
9
9
 
10
10
 
11
- `disabled`属性の値はboolean値です。
11
+ `disabled`属性の値はbool値です。
12
+
13
+
14
+
15
+ なので、`if(hintBtn.disabled === 'disabled')`の条件式だと常に`false`が返ります。
16
+
17
+
18
+
19
+ 正しくは、`if(hintBtn.disabled === true)`か、`if(hintBtn.disabled === false)`です。