【IT168技术文档】
定义菜单是在文档XML数据岛里的进行的，你只需简单地在HTML文档的HEAD部分包含XML文件即可。例如：可以定义如下：
用XML数据岛创建上下文菜单
上下文菜单就是用户在页面上单击右键时所显示的一组命令。微软的MSDN有一个简单的例子说明了怎样建立自定义菜单。这里，我们将通过XML的数据岛来快速创建自定义的上下文菜单。XML数据岛就是存在于HTML文档中的XML数据的一部分。通过XML文档对象模型[XML document object model (DOM)]，我们可以轻松地参考和引用XML里的内容。我们这里利用XML数据岛来存储上下文菜单的多个定义，其中的每一个定义都可以和文档中的任一元素相联系。在没有定义的地方，将显示默认的菜单。
Internet Explorer 5.0首次提出对上下文菜单和数据岛的支持，我们的例子在除Internet Explorer 5.0及以上的浏览器里将自动被忽略。因此，如果你使用的浏览器不是Internet Explorer 5.0及以上的版本，你将看不到任何效果，只能看到浏览器的默认菜单。如果你使用的是Internet Explorer 5.0及以上的浏览器，你可以在页面上点击鼠标右键来看效果。注意：点击图象和文字将显示不同的菜单。下面我们进行分析：
第一步：定义菜单
<xml id="contextDef">
<xmldata>
<contextmenu id="demo">
<item id="viewsource" value="查看源文件"/>
<item id="back" value="返回上页"/>
</contextmenu>
<contextmenu id="demob">
<item id="menu1" value="菜单项1" />
<item id="menu2" value="菜单项2" />
</contextmenu>
</xmldata>
</xml>
在这里，带ID属性的<xml>根节点和<xmldata>节点是必须的[注意：在XML里大小写是敏感的]。一个contextmenu节点和它所包含的多个item节点定义了一个菜单。如果你要定义多个菜单，你只需定义多个contextmenu节点即可。contextmenu节点的id属性和页面中的相应元素相关联，item节点的id属性标明哪一个菜单项被我们选取。值得注意的是：在整个XML文档里，所有的ID属性不能重名。item节点的value值就是要在菜单里要显示的文字。
第二步：和HTML里的元素相关联
<P contextmenu="demo">这个段落显示demo菜单的内容</P>
<IMG SRC="usedemob.gif" contextmenu="demob">
第三步：编写点击菜单项的执行的操作
function fnFireContext(oItem) {
switch (oItem.menuid) {
case "viewsource":
location.href = "view-source:" + location.href
break;
case "back":
history.back()
break;
default:
alert("您选的是:\n" + oItem.menuid + "\nText: " +
oItem.innerText)
}
}
你可以根据自己的需要进行更改鼠标单击事件的操作。
0
相关文章
关注我们
