onclick 事件

ການກະທົບ DOM MouseEvent

ການອະທິບາຍ ແລະ ການນໍາໃຊ້

ສະຖານະການ onclick ກຳລັງເກີດຂຶ້ນ ເມື່ອຜູ້ນຳໃຊ້ຊົງບັນຊີ.

实例

ການດຳເນີນ JavaScript ເມື່ອການຊົງຄະດີ:

<button onclick="myFunction()">Click me</button>

ທົດລອງເອງ

ມີຫຼາຍຫົວຂໍ້ TIY ຢູ່ດ້ານລຸ່ມຂອງບັນຊີ.

ຂໍ້ບັນຍາຍ

ໃນ HTML:

<element onclick="myScript">

ທົດລອງເອງ

ໃນ JavaScript:

object.onclick = function(){myScript};

ທົດລອງເອງ

ໃນ JavaScript, ນຳໃຊ້ກົນລະບົບ addEventListener():

object.addEventListener("click", myScript);

ທົດລອງເອງ

ຄວາມຄິດ:Internet Explorer 8 ຫຼືບໍ່ຫຼາຍກວ່ານັ້ນບໍ່ສະໜັບສະໜູນ addEventListener() 方法。

ລາຍລະອຽດດ້ານເຕັກນິກ

ການອົກຊົງ: ສະໜັບສະໜູນ
ສາມາດຍົກເລີກຄວາມສຳຄັນ: ສະໜັບສະໜູນ
ຊະນິດສະຖານະການ: MouseEvent
ປະກອບສ່ວນ HTML ທີ່ສະໜັບສະໜູນ: ທຸກ HTML ປະກອບສ່ວນ, ບໍ່ລວມ: <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style> ແລະ <title>
DOM 版本： Level 2 Events

ສະໜັບສະໜູນບັນຊີບັນນາທິການ

ສະຖານະການ Chrome IE Firefox Safari Opera
onclick ສະໜັບສະໜູນ ສະໜັບສະໜູນ ສະໜັບສະໜູນ ສະໜັບສະໜູນ ສະໜັບສະໜູນ

ຫຼາຍຫົວຂໍ້ອີກ

实例

ຄຳສັ່ງ: ການຊົງ <button> ເພື່ອສະແດງປະຈຸບັນວັນທີ່ ແລະ ວັນທີ່ເວລາ:

<button onclick="getElementById('demo').innerHTML = Date()">ວ່າເວລາແມ່ນໃດ?</button>

ທົດລອງເອງ

实例

单击 <p> 元素将其文本颜色更改为红色：

<p id="demo" onclick="myFunction()">Click me to change my text color.</p>
<script>
function myFunction() {
  document.getElementById("demo").style.color = "red";
}
</script>

ທົດລອງເອງ

实例

关于如何通过单击来更改 <p> 元素颜色的另一个例子：

<p onclick="myFunction(this, 'red')">Click me to change my text color.</p>
<script>
function myFunction(elmnt,clr) {
  elmnt.style.color = clr;
}
</script>

ທົດລອງເອງ

实例

单击按钮将一些文本从输入字段复制到另一个输入字段：

<button onclick="myFunction()">Copy Text</button>
<script>
function myFunction() {
  document.getElementById("field2").value = document.getElementById("field1").value;
}
</script>

ທົດລອງເອງ

实例

把 "onclick" 事件分配给 window 对象： 
window.onclick = myFunction;
// 如果用户在窗口中单击，则将 <body> 的背景颜色设置为黄色
function myFunction() {
  document.getElementsByTagName("BODY")[0].style.backgroundColor = "yellow";
}

ທົດລອງເອງ

实例

使用 onclick 创建下拉按钮：

// 获取按钮，当用户点击时，执行 myFunction
document.getElementById("myBtn").onclick = function() {myFunction()};
/* myFunction 在添加和删除 show 类之间切换，用于隐藏和显示下拉内容 */
function myFunction() {
  document.getElementById("myDropdown").classList.toggle("show");
}

ທົດລອງເອງ

ບັນດາຫຼັກສູດ

ຫຼັກສູດ JavaScriptການກະທົບ JavaScript

ການຫຼົກຫຼວງ HTML DOMການກະທົບ ondblclick

ການຫຼົກຫຼວງ HTML DOMການກະທົບ onmousedown

ການຫຼົກຫຼວງ HTML DOMການກະທົບ onmouseup

ການກະທົບ DOM MouseEvent