回答編集履歴

3

文言

2021/06/02 06:56

投稿

int32_t
int32_t

スコア21695

test CHANGED
@@ -28,7 +28,7 @@
28
28
 
29
29
 
30
30
 
31
- 動的に対象要素が増減する場合はそれぞれの要素の`oncontextmenu`をセットするのはたいへん手間なので、[イベントのバブリング](https://developer.mozilla.org/ja/docs/Learn/JavaScript/Building_blocks/Events#event_bubbling_and_capture)を利用して以下のように`document`でイベントを捕まえるのが定石です。
31
+ 動的に対象要素が増減する場合はそれぞれの要素の`oncontextmenu`をセットするのはたいへん手間なので、[イベントのバブリングを利用した委譲](https://developer.mozilla.org/ja/docs/Learn/JavaScript/Building_blocks/Events#event_delegation)を利用して以下のように`document`でイベントを捕まえるのが定石です。
32
32
 
33
33
  ```js
34
34
 

2

文言

2021/06/02 06:56

投稿

int32_t
int32_t

スコア21695

test CHANGED
@@ -28,7 +28,7 @@
28
28
 
29
29
 
30
30
 
31
- 動的に対象要素が増減する場合はそれぞれの要素の`oncontextmenu`をセットするのはたいへん手間なので、以下のように`document`でイベントを捕まえるのが定石です。
31
+ 動的に対象要素が増減する場合はそれぞれの要素の`oncontextmenu`をセットするのはたいへん手間なので、[イベントのバブリング](https://developer.mozilla.org/ja/docs/Learn/JavaScript/Building_blocks/Events#event_bubbling_and_capture)を利用して以下のように`document`でイベントを捕まえるのが定石です。
32
32
 
33
33
  ```js
34
34
 
@@ -41,3 +41,19 @@
41
41
  });
42
42
 
43
43
  ```
44
+
45
+ 古いイベントの書き方だと以下になります。
46
+
47
+
48
+
49
+ ```js
50
+
51
+ document.oncontextmenu = function(event) {
52
+
53
+ if (event.target.tagName == 'IMG' && event.target.src.includes(...))
54
+
55
+ return false;
56
+
57
+ };
58
+
59
+ ```

1

動的な要素も対象の場合

2021/06/02 06:46

投稿

int32_t
int32_t

スコア21695

test CHANGED
@@ -21,3 +21,23 @@
21
21
  img[i].setAttribute('oncontextmenu', 'return false;');
22
22
 
23
23
  ```
24
+
25
+
26
+
27
+ ----
28
+
29
+
30
+
31
+ 動的に対象要素が増減する場合はそれぞれの要素の`oncontextmenu`をセットするのはたいへん手間なので、以下のように`document`でイベントを捕まえるのが定石です。
32
+
33
+ ```js
34
+
35
+ document.addEventListener('contextmenu', event => {
36
+
37
+ if (event.target.tagName == 'IMG' && event.target.src.includes(...))
38
+
39
+ event.preventDefault();
40
+
41
+ });
42
+
43
+ ```