HTML onclick 事件
onclick 事件由元素上的鼠标点击触发。
实例
当点击按钮时执行一段 JavaScript：
<!DOCTYPE html><html><body><button onclick="myFunction()">Click me</button><p id="demo"></p><p>单击按钮时会触发一个函数。该函数在id等于demo的p元素中输出一些文本。</p><script>function myFunction() {document.getElementById("demo").innerHTML = "Hello World";}</script></body></html>
浏览器支持
| 事件 | |||||
|---|---|---|---|---|---|
| onclick | Yes | Yes | Yes | Yes | Yes |
所有主流浏览器都支持 onclick 事件。
定义和用法
onclick 事件由元素上的鼠标点击触发。
注释：onclick 事件不适用以下元素：<base>、<bdo>、<br>、<head>、<html>、<iframe>、<meta>、<param>、<script>、<style> 或 <title>。
HTML 4.01 与 HTML5 之间的差异
无。
语法
<element onclick="script">
属性值
| 值 | 描述 |
|---|---|
| script | onclick 发生时运行的脚本。 |
更多实例
<!DOCTYPE html><html><body><p id="demo" onclick="myFunction()">单击我更改文本颜色。</p><p>单击p元素时会触发函数。函数将p元素的颜色设置为红色。</p><script>function myFunction() {document.getElementById("demo").style.color = "red";}</script></body></html>
<!DOCTYPE html><html><body>字段1: <input type="text" id="field1" value="Hello World!"><br>字段2: <input type="text" id="field2"><br><br><button onclick="myFunction()">Copy Text</button><p>单击按钮时会触发一个函数。函数将文本从字段1复制到字段2。</p><script>function myFunction() {document.getElementById("field2").value = document.getElementById("field1").value;}</script></body></html>