onclick 屬性回傳當前元件 click 事件處理器的程式碼(event handler code)。

注意: 當使用 click 事件觸發動作時,同時考慮將此動作加到 keydown 事件中,讓沒使用滑鼠或使用觸控螢幕的使用者也可以進行此動作。


element.onclick = functionRef;

此處的 functionRef 為一個函式-通常是函式的名字或是函式表示式(function expression) 見 "JavaScript Guide:Functions" 來了解更多。

傳入事件處理函式(event handler function)的唯一引數為 MouseEvent 物件。在這函式中,this 為觸發此事件的元件。


<!DOCTYPE html>
<html lang="en">
    <meta charset="UTF-8" />
    <title>onclick event example</title>
      function initElement() {
        var p = document.getElementById("foo");
        // NOTE: showAlert(); or showAlert(param); will NOT work here.
        // Must be a reference to a function name, not a function call.
        p.onclick = showAlert;

      function showAlert(event) {
        alert("onclick Event detected!");
      #foo {
        border: solid blue 2px;
  <body onload="initElement();">
    <span id="foo">My Event Element</span>
    <p>click on the above element.</p>


p.onclick = function(event) { alert("moot!"); };


使用者點擊元件時會觸發 click 事件。click 事件發生在 mousedown 及 mouseup 事件之後。

這個屬性同一時間中只能指定一個 click 處理器(handler)。你也許會比較想使用 EventTarget.addEventListener(),因為它有更多的彈性而且是 DOM 事件規範的一部份。



We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!
Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support (Yes) ? ? ? ?
Feature Android Android Webview Chrome for Android Firefox Mobile (Gecko) Firefox OS IE Mobile Opera Mobile Safari Mobile
Basic support ? ? ? ? ? ? ? ?