> For the complete documentation index, see [llms.txt](https://lochiwei.gitbook.io/web/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://lochiwei.gitbook.io/web/browser/event/type/mouse/dblclick.md).

# "dblclick"

[browser](/web/browser.md) ⟩ [event](/web/browser/event.md) ⟩ [type](/web/browser/event/type.md) ⟩ [mouse](/web/browser/event/type/mouse.md) ⟩ "dblclick" 

{% hint style="success" %}
If <mark style="color:yellow;">**two clicks**</mark> happen close together, a "<mark style="color:purple;">**dblclick**</mark>" (<mark style="color:yellow;">**double-click**</mark>) event also fires, <mark style="color:red;">**after**</mark>**&#x20;**<mark style="color:yellow;">**the**</mark>**&#x20;**<mark style="color:orange;">**second**</mark>**&#x20;**<mark style="color:yellow;">**"click" event**</mark>, that is：

* mousedown -> mouseup -> click ->&#x20;
* mousedown -> mouseup -> click ->&#x20;
* dblclick&#x20;
  {% endhint %}

{% tabs %}
{% tab title="💈範例" %}

* replit ⟩ [mouse "click" event](https://replit.com/@pegasusroe/mouse-click-event#index.js)

```javascript
// general handler
const logTarget = (event, type) => {
    const len = 'mousedown'.length;
    const t = event.target;
    log(`🔘 ${type.padEnd(len, ' ')}: <${t.nodeName}> ${t.id ? '#' + t.id : ''}`);
};

// register handlers for mouse events
['mousedown', 'mouseup', 'click', 'dblclick'].forEach(type => {
    window['on' + type] = e => logTarget(e, type);
})
```

{% endtab %}

{% tab title="📗 參考" %}

* [ ] Eloquent JS ⟩ [Ch. 15: Event Handling](https://eloquentjavascript.net/15_event.html) ⟩ [Mouse Clicks](https://eloquentjavascript.net/15_event.html#i_D5iwImkmyt)
  {% endtab %}

{% tab title="📘 手冊" %}

* [Event](https://developer.mozilla.org/en-US/docs/Web/API/Event) ⟩ [UIEvent](https://developer.mozilla.org/en-US/docs/Web/API/UIEvent) ⟩ [MouseEvent](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent) ⟩&#x20;
  * [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event)
    {% endtab %}
    {% endtabs %}