如何在asp.net页面上放置的控件上实现左右键菜单,同时对之操作(2)

上文说到菜单被创建出来了,现在要说的是第二部分的:

( 2 ),选择菜单,点击菜单

选择菜单和点击菜单实际上时鼠标的 MouseMove 和 Click 事件。在上文提到的 menustyle 里面,我是通过 JavaScript 提供的 window.createPopup 函数来实现弹出菜单,弹出菜单的内容为一个表格。在表格中的每一项都提供了 MouseMove 和 Click 事件。

在 MouseMove 事件发生的时候,我就让他显示出不同的风格。

当发生 Click 事件的时候,就调用函数 fnclick ,使之发生我们的需要的任务。现在具体来介绍 menustyle ()函数。

f unction menuStyle(){

if(window.navigator.appName == "Microsoft Internet Explorer" && window.navigator.appVersion.substring(window.navigator.appVersion.indexOf("MSIE") + 5, window.navigator.appVersion.indexOf("MSIE") + 8) >= 5.5)

isIe = 1;

else

isIe = 0;

if(isIe){

menuContent = '

 1<table cellpadding="0" cellspacing="0" height="0" id="rightMenu" style="font:menu;color:menutext;" width="0"><tr height="1"><td colspan="4" style="background:black"></td></tr><tr height="10"><td style="background:black"></td><td style="background:Snow"><table cellpadding="0" cellspacing="0" nowrap="" style="font:menu;color:menutext;cursor:default;">';  //  这一行是画了个表格,从下面开始,添加表格里面的项目,同时给出了  MouseOver  的风格等。最关键的一个地方是  onClick  事件发生调用的函数为  parent.fnclickmenu  ,特别提醒的是调用的是父窗口的函数。 
 2
 3for(m=0;m<menuitems.length;m++){ #9999cc\';this.style.color="\'menutext\';&quot;" &&="" +='&lt;tr height="17" onMouseOver="this.style.background=\' <td="" if(menuitems[m][0]="" menucontent="" menuitems[m][2])="" nowrap="" onclick="parent.fnclickmenu(\''+menuItems[m][1]+'\')" onmouseout="this.style.background=\'Snow\';this.style.color=\'menutext\';" style="background:threedface" width="1"></menuitems.length;m++){></table></td><td nowrap="" width="21"><img src="' + menuItems[m][2] + '"/></td><td nowrap="">' + menuItems[m][0] + '</td><td nowrap="" width="21"></td><td nowrap="" style="background:threedface" width="1"></td></tr>'; 
 4
 5else if(menuItems[m][0]) 
 6
 7menuContent += '<tr height="17" onclick="parent.fnclickmenu(\''+menuItems[m][1]+'\')" onmouseout="this.style.background=\'Snow\';this.style.color=\'menutext\';" onmouseover="this.style.background=\'#9999cc\';this.style.color=\'menutext\';"><td nowrap="" style="background:threedface" width="1"></td><td nowrap="" width="21"></td><td nowrap="">' + menuItems[m][0] + '</td><td nowrap="" width="21"></td><td nowrap="" style="background:threedface" width="1"></td></tr>'; 
 8
 9else 
10
11menuContent += '<tr><td colspan="5" height="4"></td></tr><tr><td colspan="5"><table cellspacing="0"><tr><td height="1" width="2"></td><td height="1" style="background:threedshadow" width="0"></td><td height="1" width="2"></td></tr><tr><td height="1" width="2"></td><td height="1" style="background:threedhighlight" width="100%"></td><td height="1" width="2"></td></tr></table></td></tr><tr><td colspan="5" height="3"></td></tr>'; 
12
13} 
14
15menuContent += '</table>
1<td style="background:threedshadow"></td>
1<td style="background:threeddarkshadow"></td>
1<tr height="1"><td style="background:threedlightshadow"></td><td style="background:threedhighlight"></td><td style="background:threedface"></td><td style="background:threedshadow"></td><td style="background:threeddarkshadow"></td></tr>
1<tr height="1"><td style="background:threedlightshadow"></td><td colspan="3" style="background:threedshadow"></td><td style="background:threeddarkshadow"></td></tr>
1<tr height="1"><td colspan="5" style="background:threeddarkshadow"></td></tr>

';

// 下面就弹出了一个菜单。

menuPopup = window.createPopup();

// 菜单里面的东西为上面画出的表格。

menuPopup.document.body.innerHTML = menuContent;


结合上文的 ShowMenu (),函数,就明白了如何实现弹出菜单功能的方法了。在 fnclickmenu 函数中。你就可以轻松的加上你想处理的各种功能了。

各位看官,如果不明白还希望能够和我交流。Email:l_[email protected]

Published At
Categories with Web编程
Tagged with
comments powered by Disqus