回答編集履歴
7
追記
answer
CHANGED
|
@@ -35,10 +35,12 @@
|
|
|
35
35
|
liveweaveのリントがはくエラーを消そうとしてこう書きましたが，x_xさんのご指摘の通り，tr要素の直下にtr要素は書けないです．つまり，下のgifのようにやるのは間違いになります
|
|
36
36
|
|
|
37
37
|
|
|
38
|
+
---
|
|
39
|
+
|
|
40
|
+
#追記（20180830）
|
|
41
|
+
|
|
38
|
-
修正版
|
|
42
|
+
- 表組み修正版
|
|
39
43
|
```html
|
|
40
|
-
<!--整えたバージョン-->
|
|
41
|
-
|
|
42
44
|
<form class="form-control" action="./score" method="post">
|
|
43
45
|
<table class="layout-set" border="0" cellspacing="0" cellpadding="0">
|
|
44
46
|
<tr>
|
|
@@ -54,9 +56,9 @@
|
|
|
54
56
|
</label>
|
|
55
57
|
</td>
|
|
56
58
|
</tr>
|
|
57
|
-
|
|
59
|
+
</table>
|
|
58
|
-
|
|
60
|
+
<table id="entry_as_user">
|
|
59
|
-
|
|
61
|
+
<tr>
|
|
60
62
|
<th>ユーザー名：</th>
|
|
61
63
|
<td><input type="text" class="form-control" placeholder="ユーザー名"/></td>
|
|
62
64
|
</tr>
|
|
@@ -72,11 +74,13 @@
|
|
|
72
74
|
<option value="5">E-team</option>
|
|
73
75
|
</select>
|
|
74
76
|
</td>
|
|
75
|
-
<!-- <p>紹介された方のお名前を入力してください。</p></td> -->
|
|
76
77
|
</tr>
|
|
78
|
+
<tr>
|
|
79
|
+
<td><button type="submit">SUBMIT_A</button></td>
|
|
80
|
+
</tr>
|
|
77
|
-
|
|
81
|
+
</table>
|
|
78
|
-
|
|
82
|
+
<table id="entry_as_team">
|
|
79
|
-
|
|
83
|
+
<tr>
|
|
80
84
|
<th>チーム名：</th>
|
|
81
85
|
<td><input type="text" class="form-control" placeholder="チーム名"/></td>
|
|
82
86
|
</tr>
|
|
@@ -92,26 +96,30 @@
|
|
|
92
96
|
<option value="5">User-E</option>
|
|
93
97
|
</select>
|
|
94
98
|
</td>
|
|
95
|
-
<!-- <p>紹介された方のお名前を入力してください。</p></td> -->
|
|
96
99
|
</tr>
|
|
97
|
-
|
|
100
|
+
<tr>
|
|
101
|
+
<td><button type="submit">SUBMIT_B</button></td>
|
|
102
|
+
</tr>
|
|
98
103
|
</table>
|
|
99
104
|
</form>
|
|
100
105
|
|
|
101
106
|
<!--スクリプト-->
|
|
102
107
|
<script type="text/javascript">
|
|
103
108
|
function entryChange1(){
|
|
109
|
+
var eau = document.getElementById('entry_as_user');
|
|
110
|
+
var eat = document.getElementById('entry_as_team');
|
|
111
|
+
|
|
104
112
|
radio = document.getElementsByName('entryPlan')
|
|
105
113
|
if(radio[0].checked) {
|
|
106
114
|
//フォーム
|
|
107
|
-
|
|
115
|
+
eau.style.display = "";
|
|
108
|
-
|
|
116
|
+
eat.style.display = "none";
|
|
109
117
|
//特典
|
|
110
118
|
//document.getElementById('firstNotice').style.display = "";
|
|
111
119
|
}else if(radio[1].checked) {
|
|
112
120
|
//フォーム
|
|
113
|
-
|
|
121
|
+
eau.style.display = "none";
|
|
114
|
-
|
|
122
|
+
eat.style.display = "";
|
|
115
123
|
//特典
|
|
116
124
|
//document.getElementById('firstNotice').style.display = "none";
|
|
117
125
|
}
|
|
@@ -122,93 +130,68 @@
|
|
|
122
130
|
</script>
|
|
123
131
|
```
|
|
124
132
|
|
|
125
|
-
# 追記（20180829）
|
|
126
|
-
|
|
133
|
+
- div版+css
|
|
127
|
-
単順に，いじりたい要素にidを振り分けて操作しているだけですが
|
|
128
|
-
|
|
129
|
-
|
|
130
135
|
```html
|
|
131
136
|
<form class="form-control" action="./score" method="post">
|
|
132
|
-
<table class="layout-set" border="0" cellspacing="0" cellpadding="0">
|
|
133
|
-
|
|
137
|
+
<div>
|
|
134
|
-
|
|
138
|
+
<span>登録種別</span>
|
|
135
|
-
<td>
|
|
136
|
-
<label>
|
|
137
|
-
|
|
139
|
+
<label><input type="radio" name="entryPlan" value="hoge1" onclick="entryChange1();" checked="checked" />ユーザー</label>
|
|
140
|
+
<label><input type="radio" name="entryPlan" value="hoge2" onclick="entryChange1();" />チーム</label>
|
|
141
|
+
</div>
|
|
142
|
+
|
|
143
|
+
<div id="entry_as_user" class="form_contents">
|
|
138
|
-
|
|
144
|
+
<label>ユーザ名：
|
|
145
|
+
<input type="text" class="form-control" placeholder="ユーザー名"/>
|
|
139
|
-
|
|
146
|
+
</label>
|
|
140
|
-
|
|
147
|
+
<label>チーム名：
|
|
148
|
+
<select class="custom-select">
|
|
149
|
+
<option selected>チーム選択</option>
|
|
150
|
+
<option value="1">A-team</option>
|
|
141
|
-
|
|
151
|
+
<option value="2">B-team</option>
|
|
152
|
+
<option value="3">C-team</option>
|
|
153
|
+
<option value="4">D-team</option>
|
|
154
|
+
<option value="5">E-team</option>
|
|
142
|
-
|
|
155
|
+
</select>
|
|
143
|
-
|
|
156
|
+
</label>
|
|
157
|
+
<button type="submit">SUBMIT_A</button>
|
|
144
|
-
|
|
158
|
+
</div>
|
|
145
|
-
|
|
159
|
+
|
|
146
|
-
|
|
160
|
+
<div id="entry_as_team" class="form_contents">
|
|
147
|
-
|
|
161
|
+
<label>チーム名：
|
|
148
|
-
<
|
|
162
|
+
<input type="text" class="form-control" placeholder="チーム名"/>
|
|
149
|
-
</
|
|
163
|
+
</label>
|
|
150
|
-
<tr id="entry_select_team">
|
|
151
|
-
<th>チーム名：</th>
|
|
152
|
-
|
|
164
|
+
<label>ユーザ名：
|
|
153
|
-
|
|
165
|
+
<select class="custom-select">
|
|
154
|
-
|
|
166
|
+
<option selected>ユーザー選択</option>
|
|
155
|
-
|
|
167
|
+
<option value="1">User-A</option>
|
|
156
|
-
|
|
168
|
+
<option value="2">User-B</option>
|
|
157
|
-
|
|
169
|
+
<option value="3">User-C</option>
|
|
158
|
-
|
|
170
|
+
<option value="4">User-D</option>
|
|
159
|
-
|
|
171
|
+
<option value="5">User-E</option>
|
|
160
|
-
|
|
172
|
+
</select>
|
|
161
|
-
</td>
|
|
162
|
-
</tr>
|
|
163
|
-
<tr>
|
|
164
|
-
<!-- <p>紹介された方のお名前を入力してください。</p></td> -->
|
|
165
|
-
</tr>
|
|
166
|
-
<tr id="entry_input_team">
|
|
167
|
-
<th>チーム名：</th>
|
|
168
|
-
<td><input type="text" class="form-control" placeholder="チーム名"/></td>
|
|
169
|
-
</tr>
|
|
170
|
-
<tr id="entry_select_user">
|
|
171
|
-
<th>ユーザー名：</th>
|
|
172
|
-
<td>
|
|
173
|
-
<select class="custom-select">
|
|
174
|
-
<option selected>ユーザー選択</option>
|
|
175
|
-
<option value="1">User-A</option>
|
|
176
|
-
<option value="2">User-B</option>
|
|
177
|
-
<option value="3">User-C</option>
|
|
178
|
-
<option value="4">User-D</option>
|
|
179
|
-
<option value="5">User-E</option>
|
|
180
|
-
</select>
|
|
181
|
-
</td>
|
|
182
|
-
</tr>
|
|
183
|
-
<tr>
|
|
184
|
-
<!-- <p>紹介された方のお名前を入力してください。</p></td> -->
|
|
185
|
-
</tr>
|
|
186
|
-
|
|
173
|
+
</label>
|
|
174
|
+
<button type="submit">SUBMIT_B</button>
|
|
175
|
+
</div>
|
|
187
176
|
</form>
|
|
188
177
|
|
|
189
178
|
<!--スクリプト-->
|
|
190
179
|
<script type="text/javascript">
|
|
191
180
|
function entryChange1(){
|
|
192
|
-
var
|
|
181
|
+
var eau = document.getElementById('entry_as_user');
|
|
193
|
-
var st = document.getElementById('entry_select_team');
|
|
194
|
-
var
|
|
182
|
+
var eat = document.getElementById('entry_as_team');
|
|
195
|
-
|
|
183
|
+
|
|
196
|
-
|
|
197
184
|
radio = document.getElementsByName('entryPlan')
|
|
198
185
|
if(radio[0].checked) {
|
|
199
186
|
//フォーム
|
|
200
|
-
|
|
187
|
+
eau.style.display = "";
|
|
201
|
-
st.style.display = "";
|
|
202
|
-
|
|
188
|
+
eat.style.display = "none";
|
|
203
|
-
su.style.display = "none";
|
|
204
189
|
//特典
|
|
205
190
|
//document.getElementById('firstNotice').style.display = "";
|
|
206
191
|
}else if(radio[1].checked) {
|
|
207
192
|
//フォーム
|
|
208
|
-
|
|
193
|
+
eau.style.display = "none";
|
|
209
|
-
st.style.display = "none";
|
|
210
|
-
|
|
194
|
+
eat.style.display = "";
|
|
211
|
-
su.style.display = "";
|
|
212
195
|
//特典
|
|
213
196
|
//document.getElementById('firstNotice').style.display = "none";
|
|
214
197
|
}
|
|
@@ -217,4 +200,9 @@
|
|
|
217
200
|
//オンロードさせ、リロード時に選択を保持
|
|
218
201
|
window.onload = entryChange1;
|
|
219
202
|
</script>
|
|
203
|
+
```
|
|
204
|
+
```css
|
|
205
|
+
.form_contents >label{
|
|
206
|
+
display: block;
|
|
207
|
+
}
|
|
220
208
|
```
|
6
追記
answer
CHANGED
|
@@ -120,4 +120,101 @@
|
|
|
120
120
|
//オンロードさせ、リロード時に選択を保持
|
|
121
121
|
window.onload = entryChange1;
|
|
122
122
|
</script>
|
|
123
|
+
```
|
|
124
|
+
|
|
125
|
+
# 追記（20180829）
|
|
126
|
+
これでどうでしょう．
|
|
127
|
+
単順に，いじりたい要素にidを振り分けて操作しているだけですが
|
|
128
|
+
|
|
129
|
+
|
|
130
|
+
```html
|
|
131
|
+
<form class="form-control" action="./score" method="post">
|
|
132
|
+
<table class="layout-set" border="0" cellspacing="0" cellpadding="0">
|
|
133
|
+
<tr>
|
|
134
|
+
<th>登録種別</th>
|
|
135
|
+
<td>
|
|
136
|
+
<label>
|
|
137
|
+
<input type="radio" name="entryPlan" value="hoge1" onclick="entryChange1();" checked="checked" />
|
|
138
|
+
ユーザー
|
|
139
|
+
</label>
|
|
140
|
+
<label>
|
|
141
|
+
<input type="radio" name="entryPlan" value="hoge2" onclick="entryChange1();" />
|
|
142
|
+
チーム
|
|
143
|
+
</label>
|
|
144
|
+
</td>
|
|
145
|
+
</tr>
|
|
146
|
+
<tr id="entry_input_user">
|
|
147
|
+
<th>ユーザー名：</th>
|
|
148
|
+
<td><input type="text" class="form-control" placeholder="ユーザー名"/></td>
|
|
149
|
+
</tr>
|
|
150
|
+
<tr id="entry_select_team">
|
|
151
|
+
<th>チーム名：</th>
|
|
152
|
+
<td>
|
|
153
|
+
<select class="custom-select">
|
|
154
|
+
<option selected>チーム選択</option>
|
|
155
|
+
<option value="1">A-team</option>
|
|
156
|
+
<option value="2">B-team</option>
|
|
157
|
+
<option value="3">C-team</option>
|
|
158
|
+
<option value="4">D-team</option>
|
|
159
|
+
<option value="5">E-team</option>
|
|
160
|
+
</select>
|
|
161
|
+
</td>
|
|
162
|
+
</tr>
|
|
163
|
+
<tr>
|
|
164
|
+
<!-- <p>紹介された方のお名前を入力してください。</p></td> -->
|
|
165
|
+
</tr>
|
|
166
|
+
<tr id="entry_input_team">
|
|
167
|
+
<th>チーム名：</th>
|
|
168
|
+
<td><input type="text" class="form-control" placeholder="チーム名"/></td>
|
|
169
|
+
</tr>
|
|
170
|
+
<tr id="entry_select_user">
|
|
171
|
+
<th>ユーザー名：</th>
|
|
172
|
+
<td>
|
|
173
|
+
<select class="custom-select">
|
|
174
|
+
<option selected>ユーザー選択</option>
|
|
175
|
+
<option value="1">User-A</option>
|
|
176
|
+
<option value="2">User-B</option>
|
|
177
|
+
<option value="3">User-C</option>
|
|
178
|
+
<option value="4">User-D</option>
|
|
179
|
+
<option value="5">User-E</option>
|
|
180
|
+
</select>
|
|
181
|
+
</td>
|
|
182
|
+
</tr>
|
|
183
|
+
<tr>
|
|
184
|
+
<!-- <p>紹介された方のお名前を入力してください。</p></td> -->
|
|
185
|
+
</tr>
|
|
186
|
+
</table>
|
|
187
|
+
</form>
|
|
188
|
+
|
|
189
|
+
<!--スクリプト-->
|
|
190
|
+
<script type="text/javascript">
|
|
191
|
+
function entryChange1(){
|
|
192
|
+
var iu = document.getElementById('entry_input_user');
|
|
193
|
+
var st = document.getElementById('entry_select_team');
|
|
194
|
+
var it = document.getElementById('entry_input_team');
|
|
195
|
+
var su = document.getElementById('entry_select_user');
|
|
196
|
+
|
|
197
|
+
radio = document.getElementsByName('entryPlan')
|
|
198
|
+
if(radio[0].checked) {
|
|
199
|
+
//フォーム
|
|
200
|
+
iu.style.display = "";
|
|
201
|
+
st.style.display = "";
|
|
202
|
+
it.style.display = "none";
|
|
203
|
+
su.style.display = "none";
|
|
204
|
+
//特典
|
|
205
|
+
//document.getElementById('firstNotice').style.display = "";
|
|
206
|
+
}else if(radio[1].checked) {
|
|
207
|
+
//フォーム
|
|
208
|
+
iu.style.display = "none";
|
|
209
|
+
st.style.display = "none";
|
|
210
|
+
it.style.display = "";
|
|
211
|
+
su.style.display = "";
|
|
212
|
+
//特典
|
|
213
|
+
//document.getElementById('firstNotice').style.display = "none";
|
|
214
|
+
}
|
|
215
|
+
}
|
|
216
|
+
|
|
217
|
+
//オンロードさせ、リロード時に選択を保持
|
|
218
|
+
window.onload = entryChange1;
|
|
219
|
+
</script>
|
|
123
220
|
```
|
5
修正
answer
CHANGED
|
@@ -30,13 +30,15 @@
|
|
|
30
30
|
ちょうど開発者ツールのように，タグの入れ子構造を記述することで，閉じタグ忘れや不要な開始タグを見つけやすくなります．あと，Web開発向けのエディタ（AtomやBrackets,VSCodeなど）は，構文エラーの有無を教えてくれます．使ってみてください．
|
|
31
31
|
|
|
32
32
|
---
|
|
33
|
-
idを振るべきタグは下のタグのようです（これも，インデントを整えておけばすぐ分かる）
|
|
33
|
+
~~idを振るべきタグは下のタグのようです（これも，インデントを整えておけばすぐ分かる）~~
|
|
34
|
+
うっかりしていました（汗）
|
|
35
|
+
liveweaveのリントがはくエラーを消そうとしてこう書きましたが，x_xさんのご指摘の通り，tr要素の直下にtr要素は書けないです．つまり，下のgifのようにやるのは間違いになります
|
|
34
36
|
|
|
37
|
+
|
|
38
|
+
修正版：
|
|
35
39
|
```html
|
|
36
|
-
<!--
|
|
40
|
+
<!--整えたバージョン-->
|
|
37
41
|
|
|
38
|
-
<!--インデント整えたバージョン-->
|
|
39
|
-
|
|
40
42
|
<form class="form-control" action="./score" method="post">
|
|
41
43
|
<table class="layout-set" border="0" cellspacing="0" cellpadding="0">
|
|
42
44
|
<tr>
|
4
修正
answer
CHANGED
|
@@ -35,71 +35,87 @@
|
|
|
35
35
|
```html
|
|
36
36
|
<!--インデント整えたバージョン-->
|
|
37
37
|
|
|
38
|
+
<!--インデント整えたバージョン-->
|
|
39
|
+
|
|
38
40
|
<form class="form-control" action="./score" method="post">
|
|
39
|
-
|
|
41
|
+
<table class="layout-set" border="0" cellspacing="0" cellpadding="0">
|
|
40
|
-
|
|
42
|
+
<tr>
|
|
41
|
-
|
|
43
|
+
<th>登録種別</th>
|
|
42
|
-
|
|
44
|
+
<td>
|
|
43
|
-
|
|
45
|
+
<label>
|
|
44
|
-
|
|
46
|
+
<input type="radio" name="entryPlan" value="hoge1" onclick="entryChange1();" checked="checked" />
|
|
45
|
-
|
|
47
|
+
ユーザー
|
|
46
|
-
|
|
48
|
+
</label>
|
|
47
|
-
|
|
49
|
+
<label>
|
|
48
|
-
|
|
50
|
+
<input type="radio" name="entryPlan" value="hoge2" onclick="entryChange1();" />
|
|
49
|
-
|
|
51
|
+
チーム
|
|
50
|
-
|
|
52
|
+
</label>
|
|
51
|
-
|
|
53
|
+
</td>
|
|
52
|
-
|
|
54
|
+
</tr>
|
|
53
|
-
|
|
55
|
+
<!-- 表示非表示切り替え -->
|
|
54
|
-
<tr><!-- ←追加分-->
|
|
55
|
-
|
|
56
|
+
<tr id="firstBox">
|
|
56
|
-
|
|
57
|
+
<!--<tr> ←削除分-->
|
|
57
|
-
|
|
58
|
+
<th>ユーザー名：</th>
|
|
58
|
-
|
|
59
|
+
<td><input type="text" class="form-control" placeholder="ユーザー名"/></td>
|
|
59
|
-
|
|
60
|
+
</tr>
|
|
60
|
-
|
|
61
|
+
<tr>
|
|
61
|
-
|
|
62
|
+
<th>チーム名：</th>
|
|
62
|
-
|
|
63
|
+
<td>
|
|
63
|
-
|
|
64
|
+
<select class="custom-select">
|
|
64
|
-
|
|
65
|
+
<option selected>チーム選択</option>
|
|
65
|
-
|
|
66
|
+
<option value="1">A-team</option>
|
|
66
|
-
|
|
67
|
+
<option value="2">B-team</option>
|
|
67
|
-
|
|
68
|
+
<option value="3">C-team</option>
|
|
68
|
-
|
|
69
|
+
<option value="4">D-team</option>
|
|
69
|
-
|
|
70
|
+
<option value="5">E-team</option>
|
|
70
|
-
|
|
71
|
+
</select>
|
|
71
|
-
|
|
72
|
+
</td>
|
|
72
|
-
|
|
73
|
+
<!-- <p>紹介された方のお名前を入力してください。</p></td> -->
|
|
73
|
-
|
|
74
|
+
</tr>
|
|
75
|
+
<!-- 表示非表示切り替え -->
|
|
76
|
+
<tr id="secondBox">
|
|
77
|
+
<!--<tr> ←削除分-->
|
|
78
|
+
<th>チーム名：</th>
|
|
79
|
+
<td><input type="text" class="form-control" placeholder="チーム名"/></td>
|
|
74
|
-
|
|
80
|
+
</tr>
|
|
75
|
-
|
|
81
|
+
<tr>
|
|
76
|
-
<tr id="secondBox">
|
|
77
|
-
|
|
82
|
+
<th>ユーザー名：</th>
|
|
83
|
+
<td>
|
|
84
|
+
<select class="custom-select">
|
|
85
|
+
<option selected>ユーザー選択</option>
|
|
86
|
+
<option value="1">User-A</option>
|
|
87
|
+
<option value="2">User-B</option>
|
|
88
|
+
<option value="3">User-C</option>
|
|
89
|
+
<option value="4">User-D</option>
|
|
90
|
+
<option value="5">User-E</option>
|
|
91
|
+
</select>
|
|
92
|
+
</td>
|
|
78
|
-
|
|
93
|
+
<!-- <p>紹介された方のお名前を入力してください。</p></td> -->
|
|
79
|
-
|
|
94
|
+
</tr>
|
|
95
|
+
|
|
80
|
-
|
|
96
|
+
</table>
|
|
81
97
|
</form>
|
|
82
98
|
|
|
83
99
|
<!--スクリプト-->
|
|
84
100
|
<script type="text/javascript">
|
|
85
|
-
|
|
101
|
+
function entryChange1(){
|
|
86
|
-
|
|
102
|
+
radio = document.getElementsByName('entryPlan')
|
|
87
|
-
|
|
103
|
+
if(radio[0].checked) {
|
|
88
|
-
|
|
104
|
+
//フォーム
|
|
89
|
-
|
|
105
|
+
document.getElementById('firstBox').style.display = "";
|
|
90
|
-
|
|
106
|
+
document.getElementById('secondBox').style.display = "none";
|
|
91
|
-
|
|
107
|
+
//特典
|
|
92
|
-
|
|
108
|
+
//document.getElementById('firstNotice').style.display = "";
|
|
93
|
-
|
|
109
|
+
}else if(radio[1].checked) {
|
|
94
|
-
|
|
110
|
+
//フォーム
|
|
95
|
-
|
|
111
|
+
document.getElementById('firstBox').style.display = "none";
|
|
96
|
-
|
|
112
|
+
document.getElementById('secondBox').style.display = "";
|
|
97
|
-
|
|
113
|
+
//特典
|
|
98
|
-
|
|
114
|
+
//document.getElementById('firstNotice').style.display = "none";
|
|
99
|
-
}
|
|
100
115
|
}
|
|
116
|
+
}
|
|
101
117
|
|
|
102
|
-
|
|
118
|
+
//オンロードさせ、リロード時に選択を保持
|
|
103
|
-
|
|
119
|
+
window.onload = entryChange1;
|
|
104
120
|
</script>
|
|
105
121
|
```
|
3
追記
answer
CHANGED
|
@@ -31,4 +31,75 @@
|
|
|
31
31
|
|
|
32
32
|
---
|
|
33
33
|
idを振るべきタグは下のタグのようです（これも，インデントを整えておけばすぐ分かる）
|
|
34
|
-
|
|
34
|
+
|
|
35
|
+
```html
|
|
36
|
+
<!--インデント整えたバージョン-->
|
|
37
|
+
|
|
38
|
+
<form class="form-control" action="./score" method="post">
|
|
39
|
+
<table class="layout-set" border="0" cellspacing="0" cellpadding="0">
|
|
40
|
+
<tr>
|
|
41
|
+
<th>登録種別</th>
|
|
42
|
+
<td>
|
|
43
|
+
<label>
|
|
44
|
+
<input type="radio" name="entryPlan" value="hoge1" onclick="entryChange1();" checked="checked" />
|
|
45
|
+
ユーザー
|
|
46
|
+
</label>
|
|
47
|
+
<label>
|
|
48
|
+
<input type="radio" name="entryPlan" value="hoge2" onclick="entryChange1();" />
|
|
49
|
+
チーム
|
|
50
|
+
</label>
|
|
51
|
+
</td>
|
|
52
|
+
</tr>
|
|
53
|
+
<!-- 表示非表示切り替え -->
|
|
54
|
+
<tr><!-- ←追加分-->
|
|
55
|
+
<tr id="firstBox">
|
|
56
|
+
<!--<tr> ←削除分-->
|
|
57
|
+
<th>ユーザー名：</th>
|
|
58
|
+
<td><input type="text" class="form-control" placeholder="ユーザー名"/></td>
|
|
59
|
+
</tr>
|
|
60
|
+
<tr>
|
|
61
|
+
<th>チーム名：</th>
|
|
62
|
+
<td>
|
|
63
|
+
<select class="custom-select">
|
|
64
|
+
<option selected>チーム選択</option>
|
|
65
|
+
<option value="1">A-team</option>
|
|
66
|
+
<option value="2">B-team</option>
|
|
67
|
+
<option value="3">C-team</option>
|
|
68
|
+
<option value="4">D-team</option>
|
|
69
|
+
<option value="5">E-team</option>
|
|
70
|
+
</select>
|
|
71
|
+
</td>
|
|
72
|
+
<!-- <p>紹介された方のお名前を入力してください。</p></td> -->
|
|
73
|
+
</tr>
|
|
74
|
+
</tr>
|
|
75
|
+
<!-- 表示非表示切り替え -->
|
|
76
|
+
<tr id="secondBox">
|
|
77
|
+
<th>チーム名：</th>
|
|
78
|
+
<td><input type="text" class="form-control" placeholder="チーム名"/></td>
|
|
79
|
+
</tr>
|
|
80
|
+
</table>
|
|
81
|
+
</form>
|
|
82
|
+
|
|
83
|
+
<!--スクリプト-->
|
|
84
|
+
<script type="text/javascript">
|
|
85
|
+
function entryChange1(){
|
|
86
|
+
radio = document.getElementsByName('entryPlan')
|
|
87
|
+
if(radio[0].checked) {
|
|
88
|
+
//フォーム
|
|
89
|
+
document.getElementById('firstBox').style.display = "";
|
|
90
|
+
document.getElementById('secondBox').style.display = "none";
|
|
91
|
+
//特典
|
|
92
|
+
//document.getElementById('firstNotice').style.display = "";
|
|
93
|
+
}else if(radio[1].checked) {
|
|
94
|
+
//フォーム
|
|
95
|
+
document.getElementById('firstBox').style.display = "none";
|
|
96
|
+
document.getElementById('secondBox').style.display = "";
|
|
97
|
+
//特典
|
|
98
|
+
//document.getElementById('firstNotice').style.display = "none";
|
|
99
|
+
}
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
//オンロードさせ、リロード時に選択を保持
|
|
103
|
+
window.onload = entryChange1;
|
|
104
|
+
</script>
|
|
105
|
+
```
|
2
追記
answer
CHANGED
|
File without changes
|
1
追記
answer
CHANGED
|
@@ -27,4 +27,8 @@
|
|
|
27
27
|
開発者ツールの開き方・使い方はOS・ブラウザによって微妙に違うので，詳しいやり方はご自身で調べてみてください．
|
|
28
28
|
|
|
29
29
|
また，同様のミスを防ぐ工夫として「インデントを整える」ことをおすすめします．
|
|
30
|
-
ちょうど開発者ツールのように，タグの入れ子構造を記述することで，閉じタグ忘れや不要な開始タグを見つけやすくなります．あと，Web開発向けのエディタ（AtomやBrackets,VSCodeなど）は，構文エラーの有無を教えてくれます．使ってみてください．
|
|
30
|
+
ちょうど開発者ツールのように，タグの入れ子構造を記述することで，閉じタグ忘れや不要な開始タグを見つけやすくなります．あと，Web開発向けのエディタ（AtomやBrackets,VSCodeなど）は，構文エラーの有無を教えてくれます．使ってみてください．
|
|
31
|
+
|
|
32
|
+
---
|
|
33
|
+
idを振るべきタグは下のタグのようです（これも，インデントを整えておけばすぐ分かる）
|
|
34
|
+
|