files/zh-cn/web/api/globaleventhandlers/onpointerdown/index.html


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131

---
title: GlobalEventHandlers.onpointerdown
slug: Web/API/GlobalEventHandlers/onpointerdown
translation_of: Web/API/GlobalEventHandlers/onpointerdown
---
<div>{{ApiRef("HTML DOM")}}</div>

<p> {{event("pointerdown")}} 事件的 {{domxref("GlobalEventHandlers","全局事件处理程序")}} </p>

<h2 id="语法">语法</h2>

<pre class="syntaxbox">var <var>downHandler</var> = <var>targetElement</var>.onpointerdown;
</pre>

<h3 id="返回值">返回值</h3>

<dl>
 <dt><code>downHandler</code></dt>
 <dd><em>pointerdown</em> 事件触发对象的事件处理程序.</dd>
</dl>

<h2 id="示例">示例</h2>

<p>当前示例展示两种方式使用 <em>onpointerdown </em>去设置元素的pointerdown事件处理程序.</p>

<pre class="brush: js">&lt;html&gt;
&lt;script&gt;
function downHandler(ev) {
 // Process the pointerdown event
}
function init() {
 var el=document.getElementById("target1");
 el.onpointerdown = downHandler;
}
&lt;/script&gt;
&lt;body onload="init();"&gt;
&lt;div id="target1"&gt; Touch me ... &lt;/div&gt;
&lt;div id="target2" onpointerdown="downHandler(event)"&gt; Touch me ... &lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;
</pre>

<h2 id="规范">规范</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">Specification</th>
   <th scope="col">Status</th>
   <th scope="col">Comment</th>
  </tr>
  <tr>
   <td>{{SpecName('Pointer Events 2','#widl-GlobalEventHandlers-onpointerdown', 'onpointerdown')}}</td>
   <td>{{Spec2('Pointer Events 2')}}</td>
   <td>Non-stable version</td>
  </tr>
  <tr>
   <td>{{SpecName('Pointer Events', '#widl-GlobalEventHandlers-onpointerdown', 'onpointerdown')}}</td>
   <td>{{Spec2('Pointer Events')}}</td>
   <td>Initial definition</td>
  </tr>
 </tbody>
</table>

<h2 id="浏览器支持">浏览器支持</h2>

<p>{{CompatibilityTable}}</p>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Chrome</th>
   <th>Edge</th>
   <th>Firefox (Gecko)</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari (WebKit)</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>{{CompatChrome(55.0)}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatIE("10")}}</td>
   <td>{{CompatOpera(42)}}</td>
   <td>{{CompatNo}}</td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Android</th>
   <th>Android Webview</th>
   <th>Edge</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>Firefox OS</th>
   <th>IE Mobile</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
   <th>Chrome for Android</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatChrome(55.0)}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatIE("10")}}</td>
   <td>{{CompatOperaMobile(42)}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatChrome(55.0)}}</td>
  </tr>
 </tbody>
</table>
</div>

<h2 id="sect1"> </h2>

<h2 id="参阅">参阅</h2>

<ul>
 <li>{{ event("pointerdown") }}</li>
</ul>