Create a context menu with XML data island
Mengxian
The following menu is a set of commands displayed when the user is right-click on the page. Microsoft's MSDN has a simple
An example shows how to build a custom menu. Here, we will quickly create a self-definition through XML data island.
The context menu of righteousness. XML data island is part of XML data existing in the HTML document. by
XML Document Object Model [XML Document Object Model (DOM)], we can easily refer to and reference
The content in XML. We use XML data islands to store multiple definitions of context menu, each of which
One definition can be associated with any element in the document. Where you are not defined, the default menu will be displayed. Internet Explorer 5.0 first proposes support for context menu and data island, our example is in addition to Internet
The browser in Explorer 5.0 and above will be automatically ignored. So if you use the browser is not an Internet
Explorer 5.0 and above, you will see any effect, you can only see the browser's default menu. in case
You are using the browser of Internet Explorer 5.0 and above, you can click on the right mouse button on the page
fruit. Note: Different menus will be displayed by clicking on images and text. Let's analyze: Step 1: Define the menu definition menu is conducted in the document XML data island, you only need to simply packet in the HTML document
Contains XML files. For example: can be defined as follows:
Sensitive]. A ContextMenu node defines a menu with multiple ITEM nodes it contains. if you want
Define multiple menus, you only need to define multiple ContextMenu nodes. ContextMenu node ID attributes and pages
The corresponding elements in the face are associated, the ID attribute of the ITEM node indicates which menu item is selected by us. worth taking note of
Yes: In the entire XML document, all ID attributes cannot be renamed. The value value of the ITEM node is to be in the menu
The text to be displayed. Step 2: In the above XML data island, we define two menus Demo and Demob, you want to think and html elements.
Connected, simply simply connect the id value of ContextMenu and the ContextMenu property of the HTML element.
.
This paragraph shows the content of the Demo menu 
Step 3: Writing actions to click on the Menu item When we click When each option of the menu, the function FnfireContext is called and passes an object parameter representing the selected menu. In order to handle the incident, simply write simple Switch statements, according to different
The id value performs different operations. For example: Function FnfireContext (OITEM) {switch (OITEM.MENUID) {CASE "ViewSource": location.href = "View-source:" location.href break; case "back": history.back () Break; default: Alert ("You choose: / n" OITEM.MENUID "/ NTEXT:" OITEM.INNERTEXT)} You can change the operation of the mouse click event according to your needs. Step 4: Define the appearance of the menu Definition only Use the style. We will give a complete example, you can copy, paste
See the effect of this example! ! [Note: The browser must be IE5 ].
