x
1
2
<html>3
<head>4
<meta charset="utf-8">5
<title>蜜蜂教程(mifengjc.com)</title>6
<style>7
div {8
background: yellow;9
border: 1px solid #cccccc;10
padding: 10px;11
}12
</style>13
</head>14
<body>15
16
<p>该实例演示了如何向 menu 元素中添加 "onshow" 事件。</p>17
<div contextmenu="mymenu">18
<p>用鼠标右键单击黄色框区域查看上下文菜单！</p>19
<menu type="context" id="mymenu" onshow="myFunction()">20
<menuitem label="Refresh" onclick="window.location.reload();" icon="ico_reload.png"></menuitem>21
<menu label="Share on...">22
<menuitem label="Twitter" icon="ico_twitter.png" onclick="window.open('//twitter.com/intent/tweet?text=' + window.location.href);"></menuitem>23
<menuitem label="Facebook" icon="ico_facebook.png" onclick="window.open('//facebook.com/sharer/sharer.php?u=' + window.location.href);"></menuitem>24
</menu>25
<menuitem label="Email This Page" onclick="window.location='mailto:?body='+window.location.href;"></menuitem>26
</menu>27
</div>28
<p><strong>注意：</strong>目前只有 Firefox 浏览器支持 onshow 属性。</p>29
<script>30
function myFunction() {31
alert("上下文菜单即将显示");32
}33
</script>34
35
</body>36
</html>