回答編集履歴

2

`data-\*` 独自属性のコード追加

2016/02/03 09:34

投稿

think49
think49

スコア18156

test CHANGED
@@ -12,7 +12,7 @@
12
12
 
13
13
 
14
14
 
15
- ```JavaScript
15
+ ```HTML
16
16
 
17
17
  <input class="hoge" value="replaced!" />
18
18
 
@@ -70,4 +70,44 @@
70
70
 
71
71
 
72
72
 
73
+ **(2016/2/3 18:33追記)**
74
+
75
+ 別解。`data-*` 独自属性を使えばスマートに書けます。
76
+
77
+
78
+
79
+ ```HTML
80
+
81
+ <input class="hoge" value="replaced!" />
82
+
83
+ <p id="sample-1" class="foo" data-target-selector=".hoge-hoge">#sample-1</p>
84
+
85
+ <p class="hoge-hoge">Hello, World!</p>
86
+
87
+ <p class="hoge-hoge">Hello, World!</p>
88
+
89
+ <p id="sample-2" class="foo" data-target-selector=".hoge-hoge-hoge">#sample-2</p>
90
+
91
+ <p class="hoge-hoge-hoge">Hello, World!</p>
92
+
93
+ <p class="hoge-hoge-hoge">Hello, World!</p>
94
+
95
+ <script>
96
+
97
+ 'use strict';
98
+
99
+ jQuery('.foo').on('click', {value: jQuery('.hoge').val()}, function handleClick (event) {
100
+
101
+ jQuery(this.getAttribute('data-target-selector')).text(event.data.value);
102
+
103
+ jQuery(this).off(event.type, handleClick); // 2回目以降は無意味なのでイベントを削除しておく
104
+
105
+ });
106
+
107
+ </script>
108
+
109
+ ```
110
+
111
+
112
+
73
113
  Re: mhl さん

1

jquery\.jsを読み込む設定にしていなかったのと修正

2016/02/03 09:34

投稿

think49
think49

スコア18156

test CHANGED
@@ -6,7 +6,9 @@
6
6
 
7
7
 
8
8
 
9
+ **(2016/2/3 16:33追記) jsfiddle で jquery.js を読み込む設定にしていなかったのと修正**
10
+
9
- - [Edit fiddle - JSFiddle](https://jsfiddle.net/jn0vrq5q/)
11
+ - [Edit fiddle - JSFiddle](https://jsfiddle.net/jn0vrq5q/1/)
10
12
 
11
13
 
12
14