在线示例
当 <details> 元素在打开或关闭时执行 JavaScript:
<!DOCTYPE html>
<html>
<head>
<title>HTML ontoggle 事件属性的使用(大卫编程网 div.cn)</title>
<style>
div {
background: yellow;
border: 1px solid #cccccc;
padding: 10px;
}
</style>
</head>
<body>
<p>Open the details.</p>
<details ontoggle="myFunction()">
<summary>Copyright 1999-2019.</summary>
<p> - 版权所有.</p>
<p>详细的内容和段落在这里展示..</p>
</details>
<p><strong>Note:</strong> ontoggle事件属性支持 Chrome, Safari 6+, and Opera 15+.</p>
<script>
function myFunction() {
alert("ontoggle 事件触发");
}
</script>
</body>
</html>测试看看 ‹/›定义和用法
当用户打开或关闭<details>元素时，会触发onggle属性。
<details>元素指定用户可以按需查看或隐藏的其他详细信息。
浏览器兼容性
IEFirefoxOperaChromeSafari
HTML 4.01 与 HTML5 的区别
在HTML5中，ontoggle 属性是新增的。
语法
<element ontoggle="script">
属性值
| 值 | 描述 |
|---|---|
| script | 脚本在 ontoggle 中执行 |
| 支持的 HTML 标签: | <details> |
|---|
相关页面
HTML DOM 参考手册: ontoggle 事件