回答編集履歴
9
typoを修正
test
CHANGED
@@ -104,7 +104,7 @@
|
|
104
104
|
|
105
105
|
|
106
106
|
|
107
|
-
また、仕様では`event.which`プロパティは削除されており、代わりに`event.button`プロパティと`event.
|
107
|
+
また、仕様では`event.which`プロパティは削除されており、代わりに`event.button`プロパティと`event.buttons`プロパティの使用が推奨されています。
|
108
108
|
|
109
109
|
|
110
110
|
|
8
IE8はサポートも終了したため、それに合わせた内容に修正
test
CHANGED
@@ -72,13 +72,11 @@
|
|
72
72
|
|
73
73
|
|
74
74
|
|
75
|
-
なお、当初はこれを`click`イベントで検出する予定でしたが、
|
76
|
-
|
77
|
-
IE8以下では`mousedown`, `mouseup`, `mousemove`イベント以外の場合はどのようなクリックであっても`event.button`の値が0にな
|
75
|
+
ちなみに、IE8以下のInternet Explorerでは、`mousedown`, `mouseup`, `mousemove`イベント以外の場合は、どのようなクリックであっても`event.button`の値が0になってしまいます。
|
78
76
|
|
79
77
|
|
80
78
|
|
81
|
-
[jQuery で 右クリックと左クリックを判別](http://garafu.blogspot.
|
79
|
+
[jQuery で 右クリックと左クリックを判別 - galife](https://garafu.blogspot.com/2013/01/jquery.html)
|
82
80
|
|
83
81
|
|
84
82
|
|
@@ -86,7 +84,7 @@
|
|
86
84
|
|
87
85
|
|
88
86
|
|
89
|
-
[button property (Internet Explorer)](https://msdn.microsoft.com/library/ms533544%28en-us,VS.85%29.aspx)
|
87
|
+
~~[button property (Internet Explorer)](https://msdn.microsoft.com/library/ms533544%28en-us,VS.85%29.aspx)~~
|
90
88
|
|
91
89
|
|
92
90
|
|
@@ -96,15 +94,21 @@
|
|
96
94
|
|
97
95
|
このため、`click`イベントではクリックの種類を判定できず、利用できません。
|
98
96
|
|
97
|
+
|
98
|
+
|
99
|
-
`mouseup`イベントで
|
99
|
+
既にセキュリティサポートすら切れた古の遺産たるIE8以下を考慮する状況は限られると思います。しかし、もしIE8以下でも動く処理が必要な場合は、クリックを`mousedown`イベントや`mouseup`イベントで検知するようにしましょう。
|
100
100
|
|
101
101
|
|
102
102
|
|
103
|
-
|
103
|
+
---
|
104
104
|
|
105
105
|
|
106
106
|
|
107
|
+
また、仕様では`event.which`プロパティは削除されており、代わりに`event.button`プロパティと`event. buttons `プロパティの使用が推奨されています。
|
108
|
+
|
109
|
+
|
110
|
+
|
107
|
-
[MouseEvent.which - Web API
|
111
|
+
[MouseEvent.which - Web APIs | MDN](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/which)
|
108
112
|
|
109
113
|
|
110
114
|
|
@@ -114,6 +118,22 @@
|
|
114
118
|
|
115
119
|
|
116
120
|
|
117
|
-
|
121
|
+
> The standard alternatives to this property are [`MouseEvent.button`](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/button) and [`MouseEvent.buttons`](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/buttons).
|
122
|
+
|
123
|
+
|
124
|
+
|
125
|
+
`event.which`は今後ブラウザからも消えていくプロパティです。
|
126
|
+
|
127
|
+
しかし、jQueryでは逆に`event.button`より`event.which`の使用を推奨する記述があり、このままでは今後のWeb標準に対応できません。
|
128
|
+
|
129
|
+
|
130
|
+
|
131
|
+
[event.which | jQuery API Documentation](https://api.jquery.com/event.which/)
|
132
|
+
|
133
|
+
|
134
|
+
|
135
|
+
> Use `event.which` instead of `event.button`.
|
136
|
+
|
137
|
+
|
118
138
|
|
119
139
|
この事を視野に入れた、更なる修正が必要かもしれません。
|
7
該当の処理のソースコードを発見したため、追記
test
CHANGED
@@ -4,7 +4,13 @@
|
|
4
4
|
|
5
5
|
```JavaScript
|
6
6
|
|
7
|
+
/*
|
8
|
+
|
7
|
-
|
9
|
+
* jQueryが内部的に行う`event.which`プロパティの定義
|
10
|
+
|
11
|
+
* https://github.com/jquery/jquery/blob/3.3.1/src/event.js#L636-L662
|
12
|
+
|
13
|
+
*/
|
8
14
|
|
9
15
|
var button = event.button;
|
10
16
|
|
@@ -20,7 +26,13 @@
|
|
20
26
|
|
21
27
|
|
22
28
|
|
23
|
-
/*
|
29
|
+
/*
|
30
|
+
|
31
|
+
* 判定箇所
|
32
|
+
|
33
|
+
* https://github.com/wikimedia/mediawiki-extensions-MultimediaViewer/blob/6b83fca574e3dcc2fa4526117f88940dcfc06f30/resources/mmv/mmv.bootstrap.js#L431-L434
|
34
|
+
|
35
|
+
*/
|
24
36
|
|
25
37
|
if ((event.button !== 0 && event.which !== 1) || event.altKey || event.ctrlKey || event.shiftKey || event.metaKey) {
|
26
38
|
|
@@ -33,6 +45,12 @@
|
|
33
45
|
}
|
34
46
|
|
35
47
|
```
|
48
|
+
|
49
|
+
|
50
|
+
|
51
|
+
* [jquery/event.js at 3.3.1 · jquery/jquery](https://github.com/jquery/jquery/blob/3.3.1/src/event.js#L636-L662)
|
52
|
+
|
53
|
+
* [mediawiki-extensions-MultimediaViewer/mmv.bootstrap.js at 6b83fca574e3dcc2fa4526117f88940dcfc06f30 · wikimedia/mediawiki-extensions-MultimediaViewer](https://github.com/wikimedia/mediawiki-extensions-MultimediaViewer/blob/6b83fca574e3dcc2fa4526117f88940dcfc06f30/resources/mmv/mmv.bootstrap.js#L431-L434)
|
36
54
|
|
37
55
|
|
38
56
|
|
6
クリックによるページ移動はキーから指を離した時に発生するため、mousedownではなくmouseupに修正。
test
CHANGED
@@ -78,7 +78,7 @@
|
|
78
78
|
|
79
79
|
このため、`click`イベントではクリックの種類を判定できず、利用できません。
|
80
80
|
|
81
|
-
`mouse
|
81
|
+
`mouseup`イベントで判定を行う予定です。
|
82
82
|
|
83
83
|
|
84
84
|
|
5
「W3Cの」仕様であるのか不明確だったため、「W3C」という単語を削除
test
CHANGED
@@ -1,4 +1,6 @@
|
|
1
1
|
MediaWikiの[Media Viewer](https://ja.wikipedia.org/wiki/Wikipedia:Media_Viewer)がまさにこの質問で求める動作をしていたため[デバッグ](http://shim0mura.hatenadiary.jp/entry/20111231/1325357395)を行ってみたところ、以下の処理により判定を行っていました。
|
2
|
+
|
3
|
+
|
2
4
|
|
3
5
|
```JavaScript
|
4
6
|
|
@@ -32,6 +34,8 @@
|
|
32
34
|
|
33
35
|
```
|
34
36
|
|
37
|
+
|
38
|
+
|
35
39
|
変数`event`は、対象のイベントのイベントオブジェクトです。
|
36
40
|
|
37
41
|
判定としては、[event.button](https://developer.mozilla.org/ja/docs/Web/API/Event/button)または[event.which](http://js.studio-kingdom.com/jquery/events/event_which)で「左クリック以外」かの判定と、CtrlやShift等の特殊キーが押下されているかをORで判定していました。
|
@@ -43,6 +47,8 @@
|
|
43
47
|
当然、より多くのユーザに対応するため、様々な環境で検証を行い、動作を確認しているコードのはずです。
|
44
48
|
|
45
49
|
よって、信頼性は十分であり、「普通のクリック」と「別タブ/ウィンドウで開くクリック」を区別する方法として、これが適切であると考えます。
|
50
|
+
|
51
|
+
|
46
52
|
|
47
53
|
---
|
48
54
|
|
@@ -56,11 +62,15 @@
|
|
56
62
|
|
57
63
|
[jQuery で 右クリックと左クリックを判別](http://garafu.blogspot.jp/2013/01/jquery.html)
|
58
64
|
|
65
|
+
|
66
|
+
|
59
67
|
> ちなみに、clickイベント時、IE8 だと button プロパティが 0 にしかならないので使えない…
|
60
68
|
|
61
69
|
|
62
70
|
|
63
71
|
[button property (Internet Explorer)](https://msdn.microsoft.com/library/ms533544%28en-us,VS.85%29.aspx)
|
72
|
+
|
73
|
+
|
64
74
|
|
65
75
|
> This property is used with the onmousedown, onmouseup, and onmousemove events. For other events, it defaults to 0 regardless of the state of the mouse buttons.
|
66
76
|
|
@@ -72,11 +82,13 @@
|
|
72
82
|
|
73
83
|
|
74
84
|
|
75
|
-
また、
|
85
|
+
また、仕様では`event.which`は削除され、`event.button`が推奨されています。
|
76
86
|
|
77
87
|
|
78
88
|
|
79
89
|
[MouseEvent.which - Web API Interfaces | MDN](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/which)
|
90
|
+
|
91
|
+
|
80
92
|
|
81
93
|
> Non-standard
|
82
94
|
|
4
イベント名に"on"がついていたため、これを削除
test
CHANGED
@@ -50,7 +50,7 @@
|
|
50
50
|
|
51
51
|
なお、当初はこれを`click`イベントで検出する予定でしたが、
|
52
52
|
|
53
|
-
IE8以下では`
|
53
|
+
IE8以下では`mousedown`, `mouseup`, `mousemove`イベント以外の場合はどのようなクリックであっても`event.button`の値が0になるという仕様が存在します。
|
54
54
|
|
55
55
|
|
56
56
|
|
3
引用を追加
test
CHANGED
@@ -48,14 +48,42 @@
|
|
48
48
|
|
49
49
|
|
50
50
|
|
51
|
+
なお、当初はこれを`click`イベントで検出する予定でしたが、
|
52
|
+
|
51
|
-
|
53
|
+
IE8以下では`onmousedown`, `onmouseup`, `onmousemove`イベント以外の場合はどのようなクリックであっても`event.button`の値が0になるという仕様が存在します。
|
54
|
+
|
55
|
+
|
52
56
|
|
53
57
|
[jQuery で 右クリックと左クリックを判別](http://garafu.blogspot.jp/2013/01/jquery.html)
|
58
|
+
|
59
|
+
> ちなみに、clickイベント時、IE8 だと button プロパティが 0 にしかならないので使えない…
|
60
|
+
|
61
|
+
|
62
|
+
|
63
|
+
[button property (Internet Explorer)](https://msdn.microsoft.com/library/ms533544%28en-us,VS.85%29.aspx)
|
64
|
+
|
65
|
+
> This property is used with the onmousedown, onmouseup, and onmousemove events. For other events, it defaults to 0 regardless of the state of the mouse buttons.
|
66
|
+
|
67
|
+
|
68
|
+
|
69
|
+
このため、`click`イベントではクリックの種類を判定できず、利用できません。
|
70
|
+
|
71
|
+
`mousedown`イベントで判定を行う予定です。
|
54
72
|
|
55
73
|
|
56
74
|
|
57
75
|
また、W3Cの仕様では`event.which`は削除され、`event.button`が推奨されています。
|
58
76
|
|
77
|
+
|
78
|
+
|
79
|
+
[MouseEvent.which - Web API Interfaces | MDN](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/which)
|
80
|
+
|
81
|
+
> Non-standard
|
82
|
+
|
83
|
+
> This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.
|
84
|
+
|
85
|
+
|
86
|
+
|
59
87
|
`event.which`は今後非対応となるプロパティですが、jQueryでは逆に`event.button`より`event.which`の使用を推奨する記述があり、このままでは今後のWeb標準に対応できません。
|
60
88
|
|
61
89
|
この事を視野に入れた、更なる修正が必要かもしれません。
|
2
MediaWikiのコードが信頼に足る理由と、event.whichによる左クリック判定の今後について記述を追加。
test
CHANGED
@@ -36,10 +36,26 @@
|
|
36
36
|
|
37
37
|
判定としては、[event.button](https://developer.mozilla.org/ja/docs/Web/API/Event/button)または[event.which](http://js.studio-kingdom.com/jquery/events/event_which)で「左クリック以外」かの判定と、CtrlやShift等の特殊キーが押下されているかをORで判定していました。
|
38
38
|
|
39
|
+
|
40
|
+
|
41
|
+
MediaWikiは、世界で5番目に人気のあるウェブサイトWikipediaで使用されているシステムです。
|
42
|
+
|
43
|
+
当然、より多くのユーザに対応するため、様々な環境で検証を行い、動作を確認しているコードのはずです。
|
44
|
+
|
39
|
-
「普通のクリック」と「別タブ/ウィンドウで開くクリック」を区別する方法として、これが適切であると考えます。
|
45
|
+
よって、信頼性は十分であり、「普通のクリック」と「別タブ/ウィンドウで開くクリック」を区別する方法として、これが適切であると考えます。
|
46
|
+
|
47
|
+
---
|
40
48
|
|
41
49
|
|
42
50
|
|
43
51
|
なお、当初はこれを`click`イベントで検出する予定でしたが、IE8以下では`click`イベントの場合に`event.button`でクリックの種類を判定できない問題があるため、`mousedown`イベントで判定を行う予定です。
|
44
52
|
|
45
53
|
[jQuery で 右クリックと左クリックを判別](http://garafu.blogspot.jp/2013/01/jquery.html)
|
54
|
+
|
55
|
+
|
56
|
+
|
57
|
+
また、W3Cの仕様では`event.which`は削除され、`event.button`が推奨されています。
|
58
|
+
|
59
|
+
`event.which`は今後非対応となるプロパティですが、jQueryでは逆に`event.button`より`event.which`の使用を推奨する記述があり、このままでは今後のWeb標準に対応できません。
|
60
|
+
|
61
|
+
この事を視野に入れた、更なる修正が必要かもしれません。
|
1
「デバッグ」にリンクを追加
test
CHANGED
@@ -1,4 +1,4 @@
|
|
1
|
-
MediaWikiの[Media Viewer](https://ja.wikipedia.org/wiki/Wikipedia:Media_Viewer)がまさにこの質問で求める動作をしていたためデバッグを行ってみたところ、以下の処理により判定を行っていました。
|
1
|
+
MediaWikiの[Media Viewer](https://ja.wikipedia.org/wiki/Wikipedia:Media_Viewer)がまさにこの質問で求める動作をしていたため[デバッグ](http://shim0mura.hatenadiary.jp/entry/20111231/1325357395)を行ってみたところ、以下の処理により判定を行っていました。
|
2
2
|
|
3
3
|
```JavaScript
|
4
4
|
|