質問編集履歴

1

ご指摘を受けて加筆させて頂きました

2017/05/15 02:07

投稿

pegy
pegy

スコア243

test CHANGED
File without changes
test CHANGED
@@ -7,3 +7,67 @@
7
7
  選択、追加、削除、jqueryのような検索でもうまく見つけることができなかったのですが、端的な方法や有用なサイトがあればご教示願いたく存じます。
8
8
 
9
9
  宜しくお願い致します。
10
+
11
+
12
+
13
+ 【加筆】
14
+
15
+ ご指摘を頂きましたので、イメージとなるコードを記載させて頂きます。
16
+
17
+ selectを使用していますが、そもそもselectを使うべきかやjqueryを使うべきかも不明なため
18
+
19
+ 的外れであれば、またご指摘を頂ければ幸いです。
20
+
21
+
22
+
23
+ イメージとしては、下記のHTMLでbox1で複数選択した状態のものをbutton1を押せば、box2の要素のoptionがapendされ
24
+
25
+ 反対にbox2で複数選択した状態のものをbutton2を押せばbox2の要素のからoptionが削除されるようなものとなります。
26
+
27
+
28
+
29
+ 私のJS(Jquery)の知識では例えば、box1のoptionをクリックというイベントを通じて、
30
+
31
+ box2にoptionを追加したりすることはできるのですが、
32
+
33
+ 1)複数の要素を選択した状態のものを変数に格納しておき、2)buttonをクリックするというイベントを通じてapendする
34
+
35
+ という2段階の方法に迷っています。
36
+
37
+ 特に1)の場合、複数選択している状態というのをjquery上どのように検知する方法があるのかというのを探しております。
38
+
39
+
40
+
41
+
42
+
43
+
44
+
45
+ ```HTML
46
+
47
+
48
+
49
+ <select name="entity1" id="box1" multiple>
50
+
51
+ <option value="a">a</option>
52
+
53
+ <option value="b">b</option>
54
+
55
+ <option value="c">c</option>
56
+
57
+ </select>
58
+
59
+
60
+
61
+ <button type="button" name="button" id="botton1">追加</button>
62
+
63
+ <button type="button" name="button" id="botton2">削除</button>
64
+
65
+
66
+
67
+ <select name="entity2" id="box2" multiple>
68
+
69
+ </select>
70
+
71
+
72
+
73
+ ```