当用户单击按钮时,onclick事件属性起作用。当鼠标单击该元素时,脚本将运行。
用法:
<element onlick = "script">
属性值:该属性包含单值脚本,该脚本在鼠标单击元素时起作用。
支持的标签:除<base>,<bdo>,<br>,<head>,<html>,<iframe>,<meta>,<param>,<script>,<style>之外的所有HTML标签均支持此属性。 >和<title>。
范例1:
<!DOCTYPE HTML>
<html>
<head>
<title>
onclick event attribute
</title>
<script>
/* If onclick event call then
this script will run */
function onclick_event() {
document.getElementById("geeks").innerHTML
= "Welcome to GeeksforGeeks!";
}
</script>
</head>
<body style = "text-align:center">
<!-- onclick event call here -->
<p id = "geeks" onclick = "onclick_event()">
Click Here
</p>
</body>
</html>
输出:
前:
Click Here
后:
Welcome to GeeksforGeeks!
范例2:使用按钮标签调用事件。
<!DOCTYPE html>
<html>
<head>
<title>
onclick event attribute
</title>
<script>
function funonclick() {
document.getElementById("geeks").innerHTML =
"Welcome to GeeksforGeeks!";
}
</script>
</head>
<body style = "text-align:center">
<!-- onclick event call here -->
<button onclick = "funonclick()">
Click Here
</button>
<p id = "geeks"></p>
</body>
</html>
输出:
支持的浏览器:下面列出了onclick事件属性支持的浏览器:
- 谷歌浏览器
- IE浏览器
- Firefox
- Safari
- Opera
相关用法
- HTML onclick事件用法及代码示例
- HTML oninvalid用法及代码示例
- HTML onsubmit用法及代码示例
- HTML onunload用法及代码示例
- HTML onkeyup用法及代码示例
- HTML ondrop用法及代码示例
- HTML onpageshow用法及代码示例
- HTML onsearch用法及代码示例
- HTML onhashchange用法及代码示例
- HTML onerror用法及代码示例
- HTML onbeforeunload用法及代码示例
- HTML onbeforeprint用法及代码示例
- HTML onafterprint用法及代码示例
- HTML onchange用法及代码示例
- HTML oninput用法及代码示例
- HTML ondblclick用法及代码示例
- HTML onload用法及代码示例
- HTML onmousemove用法及代码示例
- HTML onmouseup用法及代码示例
- HTML onwheel用法及代码示例
注:本文由纯净天空筛选整理自PERIYANAYAKI大神的英文原创作品 HTML | onclick Event Attribute。非经特殊声明,原始代码版权归原作者所有,本译文未经允许或授权,请勿转载或复制。