teratail header banner
teratail header banner
質問するログイン新規登録

回答編集履歴

1

追記

2017/11/02 03:17

投稿

yambejp
yambejp

スコア117914

answer CHANGED
@@ -18,4 +18,35 @@
18
18
 
19
19
  ```HTML
20
20
  <div class="elements">xxxxx<div>
21
+ ```
22
+ # 追記
23
+ .elements動的に作成して処理したいとのことなので以下修正版です
24
+
25
+ ```CSS
26
+ /* 変更なし */
27
+ .elements:hover,.elements.gray:hover{
28
+ background-color:#abfeb6;
29
+ }
30
+ .elements.gray{
31
+ background-color:#bbbbbb;
32
+ }
33
+ ```
34
+ ```
35
+ $(function(){
36
+ /* elements追加処理、適当なので状況にあわせて要修正 */
37
+ $('input[type=button][value=add]').on('click',function(){
38
+ $('#testarea').append($('<div>').addClass('elements').text('xxxxx'));
39
+ });
40
+ /* dblclick処理はセレクタを修正 */
41
+ $(document).on('dblclick','.elements',function(){
42
+ $(this).addClass('gray');
43
+ });
44
+ });
45
+ ```
46
+ ```HTML
47
+ <!-- addボタンをおすと.elementsが#testareaに追加されます-->
48
+ <input type="button" value="add">
49
+ <div id="testarea">
50
+ <div class="elements">xxxxx</div>
51
+ </div>
21
52
  ```