回答編集履歴
2
解説つき
test
CHANGED
|
@@ -3,6 +3,8 @@
|
|
|
3
3
|
|
|
4
4
|
|
|
5
5
|
```css
|
|
6
|
+
|
|
7
|
+
/*formが幅をとるのでとりあえずinlineにしておく*/
|
|
6
8
|
|
|
7
9
|
form{display:inline}
|
|
8
10
|
|
|
@@ -10,39 +12,61 @@
|
|
|
10
12
|
|
|
11
13
|
```script
|
|
12
14
|
|
|
15
|
+
/*セレクトボックスから呼び出す関数、内容はダミー*/
|
|
16
|
+
|
|
13
17
|
function imgChange(){
|
|
14
18
|
|
|
15
19
|
console.log("call imgchange");
|
|
16
20
|
|
|
17
21
|
}
|
|
18
22
|
|
|
23
|
+
/*ボタンを押すと呼び出される関数 テーブルに行を追加*/
|
|
24
|
+
|
|
19
25
|
function AddTableRows(){
|
|
20
26
|
|
|
27
|
+
/*挿入したいテーブルのtbodyを"t"とする*/
|
|
28
|
+
|
|
21
29
|
var t = document.querySelector("#table1 tbody");
|
|
30
|
+
|
|
31
|
+
/*挿入したい行を"row"とし、"row"を"t"に挿入する*/
|
|
22
32
|
|
|
23
33
|
var row = document.createElement("tr");
|
|
24
34
|
|
|
25
35
|
t.appendChild(row);
|
|
26
36
|
|
|
37
|
+
/*挿入したいセルを"cell"とし、"cell"を"row"に挿入する*/
|
|
38
|
+
|
|
27
39
|
var cell = document.createElement("td");
|
|
28
40
|
|
|
29
41
|
row.appendChild(cell);
|
|
30
42
|
|
|
43
|
+
/*"cell"にクラス"syu"を追加する*/
|
|
44
|
+
|
|
31
45
|
cell.classList.add("syu");
|
|
46
|
+
|
|
47
|
+
/*挿入したいセルを"f"とし、"f"を"cell"に挿入する*/
|
|
32
48
|
|
|
33
49
|
var f = document.createElement("form");
|
|
34
50
|
|
|
35
51
|
cell.appendChild(f);
|
|
36
52
|
|
|
53
|
+
/*挿入したいセレクトボックスを"s"とし、"s"を"f"に挿入する*/
|
|
54
|
+
|
|
37
55
|
var s = document.createElement("select");
|
|
38
56
|
|
|
39
57
|
f.appendChild(s);
|
|
40
58
|
|
|
59
|
+
/*"s"に、"shumoku"というnameを設定する*/
|
|
60
|
+
|
|
41
61
|
s.setAttribute("name","shumoku");
|
|
62
|
+
|
|
63
|
+
/*"s"に、onchange時に実行する関数imgChangeを設定する*/
|
|
42
64
|
|
|
43
65
|
s.addEventListener("change",function(){imgChange();});
|
|
44
66
|
|
|
67
|
+
/*セレクトボックスに入れるoptionのvalueとテキストの一覧を作っておいて*/
|
|
68
|
+
|
|
45
|
-
|
|
69
|
+
[
|
|
46
70
|
|
|
47
71
|
{value:0,text:"aaa"},
|
|
48
72
|
|
|
@@ -56,15 +80,23 @@
|
|
|
56
80
|
|
|
57
81
|
{value:5,text:"fff"},
|
|
58
82
|
|
|
83
|
+
/*mapをつかって一覧の頭から順番に処理*/
|
|
84
|
+
|
|
59
85
|
].map(function(i){
|
|
86
|
+
|
|
87
|
+
/*挿入したいオプションを"o"とし、"o"を"s"に挿入する*/
|
|
60
88
|
|
|
61
89
|
var o = document.createElement("option");
|
|
62
90
|
|
|
91
|
+
s.appendChild(o);
|
|
92
|
+
|
|
93
|
+
/*oのvalueに一覧から受け取ったオブジェクト"i"のvalue値を設定する*/
|
|
94
|
+
|
|
63
95
|
o.setAttribute("value",i.value);
|
|
64
96
|
|
|
97
|
+
/*oのテキストに一覧から受け取ったオブジェクト"i"のtext値を設定する*/
|
|
98
|
+
|
|
65
99
|
o.appendChild(document.createTextNode(i.text));
|
|
66
|
-
|
|
67
|
-
s.appendChild(o);
|
|
68
100
|
|
|
69
101
|
});
|
|
70
102
|
|
1
調整
test
CHANGED
|
@@ -28,7 +28,7 @@
|
|
|
28
28
|
|
|
29
29
|
row.appendChild(cell);
|
|
30
30
|
|
|
31
|
-
cell.classList.add("
|
|
31
|
+
cell.classList.add("syu");
|
|
32
32
|
|
|
33
33
|
var f = document.createElement("form");
|
|
34
34
|
|