---
title: MouseEvent.buttons
slug: Web/API/MouseEvent/buttons
translation_of: Web/API/MouseEvent/buttons
---
<div>{{APIRef("DOM Events")}}</div>

<div>只读属性<strong><code>MouseEvent.buttons</code></strong><code>指示事件触发时哪些鼠标按键被按下。</code></div>

<div></div>

<p>每一个按键都用一个给定的数（见下文）表示。如果同时多个按键被按下，buttons 的值为各键对应值做与计算（+）后的值。例如，如果右键（2）和滚轮键（4）被同时按下，buttons 的值为 2 + 4 = 6。</p>

<div class="note">
<p><strong>注意：</strong>属性 MouseEvent.button 和 MouseEvent.buttons 是不同的。MouseEvent.buttons 可指示任意鼠标事件中鼠标的按键情况，而 MouseEvent.button 只能保证在由按下和释放一个或多个按键时触发的事件中获得正确的值。</p>
</div>

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

<pre class="syntaxbox">var <em>buttonPressed</em> = <em>instanceOfMouseEvent</em>.buttons
</pre>

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

<p>一个数字，用来标识鼠标按下的一个或者多个按键。如果按下的键为多个，则值等于所有按键对应数值进行或(|)运算的结果。</p>

<ul>
 <li><code>0 </code> : 没有按键或者是没有初始化</li>
 <li><code>1 </code> : 鼠标左键</li>
 <li><code>2 </code> : 鼠标右键</li>
 <li><code>4 </code> : 鼠标滚轮或者是中键</li>
 <li><code>8 </code> : 第四按键 (通常是“浏览器后退”按键)</li>
 <li><code>16</code> : 第五按键 (通常是“浏览器前进”)</li>
</ul>

<h2 id="Specifications">Specifications</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('DOM3 Events','#widl-MouseEvent-buttons','MouseEvent.buttons')}}</td>
   <td>{{Spec2('DOM3 Events')}}</td>
   <td>Initial definition</td>
  </tr>
 </tbody>
</table>

<h2 id="Browser_compatibility">Browser compatibility</h2>

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

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Edge</th>
   <th>Firefox (Gecko)</th>
   <th>Chrome</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatVersionUnknown}}<sup>[1]</sup></td>
   <td>43<sup>[2]</sup></td>
   <td>9</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatNo}}</td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Edge</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>Android</th>
   <th>IE Mobile</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatUnknown}}</td>
  </tr>
 </tbody>
</table>
</div>

<p>[1] Gecko supports the <code>buttons</code> attribute on Windows, Linux (GTK), and Mac OS with the following restrictions:</p>

<ul>
 <li>On Windows, if you install a mouse driver, and its utility software allows you to customize button actions (e.g., IntelliPoint and SetPoint), the middle (wheel) button, the 4th button, and the 5th button might not be set, even when they are pressed.</li>
 <li>On Linux (GTK), the 4th button and the 5th button are not supported. In addition, a mouseup event always has the releasing button information in this attribute value.</li>
 <li>On Mac OS X 10.5, the buttons attribute always returns 0 because there is no platform API for implementing this feature.</li>
</ul>

<p>[2] This feature got implemented in <a href="https://crbug.com/276941">bug 276941</a>.</p>

<h2 id="See_also">See also</h2>

<ul>
 <li>{{domxref("MouseEvent")}}</li>
</ul>