回答編集履歴

3

間違い修正

2017/05/10 02:35

投稿

morisoba
morisoba

スコア90

test CHANGED
@@ -120,7 +120,7 @@
120
120
 
121
121
  var targetElm = document.getElementById(foodKind);
122
122
 
123
- targetElm.disabled = selectedFoodKind === foodKind ? null : true;
123
+ targetElm.disabled = selectedFoodKind !== foodKind;
124
124
 
125
125
  targetElm.style = selectedFoodKind === foodKind ? "display:inline" : "display:none";
126
126
 

2

display:block を display:inline に変更

2017/05/10 02:35

投稿

morisoba
morisoba

スコア90

test CHANGED
@@ -122,7 +122,7 @@
122
122
 
123
123
  targetElm.disabled = selectedFoodKind === foodKind ? null : true;
124
124
 
125
- targetElm.style = selectedFoodKind === foodKind ? "display:block" : "display:none";
125
+ targetElm.style = selectedFoodKind === foodKind ? "display:inline" : "display:none";
126
126
 
127
127
  }
128
128
 

1

js の中の文字列中の html を排除

2017/05/09 18:15

投稿

morisoba
morisoba

スコア90

test CHANGED
@@ -83,3 +83,121 @@
83
83
 
84
84
 
85
85
  配列を連想配列に変更し、食べ物の種別をキーにしてみました。
86
+
87
+
88
+
89
+ ---
90
+
91
+
92
+
93
+ 追記です。
94
+
95
+
96
+
97
+ html を js の中の文字列に埋め込んでいるのが気に食わなかったので、改変しました↓
98
+
99
+
100
+
101
+ ```html
102
+
103
+ <!DOCTYPE html>
104
+
105
+ <html lang="ja">
106
+
107
+ <head>
108
+
109
+ <meta charset="UTF-8" />
110
+
111
+ <title>Document</title>
112
+
113
+ <script languge="javascript">
114
+
115
+ var foodKinds = ['ラーメン', '蕎麦', 'カレーライス'];
116
+
117
+ function change(selectedFoodKind) {
118
+
119
+ for (var foodKind of foodKinds) {
120
+
121
+ var targetElm = document.getElementById(foodKind);
122
+
123
+ targetElm.disabled = selectedFoodKind === foodKind ? null : true;
124
+
125
+ targetElm.style = selectedFoodKind === foodKind ? "display:block" : "display:none";
126
+
127
+ }
128
+
129
+ }
130
+
131
+ </script>
132
+
133
+ </head>
134
+
135
+ <body>
136
+
137
+ <form name="FORM1">
138
+
139
+
140
+
141
+ <div>
142
+
143
+ <input type="radio" name="radio1" value="ラーメン" id="r1" checked onclick="change(this.value)"><label for="r1">ラーメン</label>
144
+
145
+ <input type="radio" name="radio1" value="蕎麦" id="r2" onclick="change(this.value)"><label for="r2">蕎麦</label>
146
+
147
+ <input type="radio" name="radio1" value="カレーライス" id="r3" onclick="change(this.value)"><label for="r3">カレーライス</label><br>
148
+
149
+ </div>
150
+
151
+
152
+
153
+ <select id="ラーメン" name="select1">
154
+
155
+ <option value="醤油ラーメン">醤油ラーメン</option>
156
+
157
+ <option value="味噌ラーメン">味噌ラーメン</option>
158
+
159
+ <option value="塩ラーメン">塩ラーメン</option>
160
+
161
+ <option value="とんこつラーメン">とんこつラーメン</option>
162
+
163
+ </select>
164
+
165
+
166
+
167
+ <select id="蕎麦" name="select2" style='display:none' disabled>
168
+
169
+ <option value="もりそば">もりそば</option>
170
+
171
+ <option value="かき揚げそば">かき揚げ蕎麦</option>
172
+
173
+ <option value="カレー南蛮">カレー南蛮</option>
174
+
175
+ <option value="天ぷらそば">天ぷらそば</option>
176
+
177
+ </select>
178
+
179
+
180
+
181
+ <select id="カレーライス" name="select3" style='display:none' disabled>
182
+
183
+ <option value="チキンカレー">チキンカレー</option>
184
+
185
+ <option value="ビーフカレー">ビーフカレー</option>
186
+
187
+ <option value="ほうれん草カレー">ほうれん草カレー</option>
188
+
189
+ <option value="キーマカレー">キーマカレー</option>
190
+
191
+ </select>
192
+
193
+
194
+
195
+ <input type=submit value="send">
196
+
197
+ </form>
198
+
199
+ </body>
200
+
201
+ </html>
202
+
203
+ ```