javascript:window.popup()+XSLT弹出式菜单

一、菜单XML内容文档

--menu.xsl

<?xml version="1.0" encoding="GB2312"?>
<xsl:stylesheet version="1.0" xmlns:xsl="
http://www.w3.org/1999/XSL/Transform">

<xsl:template match="menu">
<HTML>
<HEAD>
<TITLE> </TITLE>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"/>
<style>
body,td{
 font-size:9pt;
}
.PopMenuOutset{border:1px solid;border-color: buttonface threeddarkshadow threeddarkshadow buttonface;FILTER: progid:DXImageTransform.Microsoft.Shadow(direction=135,color=buttonshadow,strength=3); }
.PopMenuInset{border:1px solid;border-color: buttonhighlight buttonshadow buttonshadow buttonhighlight;}
.PopMenu{background-color: buttonface;}
.PopMenuItem{height:18px;cursor:default;}
.PopMenuItemOver{height:18px;background-color: highlight;color:highlighttext;cursor:default;}
.PopMenuItemOver img{height:18px;background-color: highlight;color:highlighttext;cursor:default;}
</style>
</HEAD>

<BODY leftmargin="0" topmargin="0" scroll="no" style="border:0">
<script>
<![CDATA[
// 当前展开的菜单项
var preObj = null;

// 创建当前窗体(可以是IE窗体也可以是Popup窗体)的Popup对象
// 这个Popup对象就是用来存储子菜单数据的
var oPopup = document.parentWindow.createPopup();

// 装载xsl
var stylesheet = new ActiveXObject("Microsoft.XMLDOM");
stylesheet.async = false;
stylesheet.load( "menu.xsl" );

// 预装载图片
var img = new Image;
img.src = "images/ArrowRHighlight.gif";


function ItemDbClick(obj,id,name)
{
 //ItemOver(obj);
 returnValue(id,name);
}

function returnValue(id,name) {
   parent.returnValue(id,name);
}
// 鼠标经过菜单项
function ItemOver(obj) {
    obj.className='PopMenuItemOver';
}

// 鼠标点击菜单项
function ItemClick(obj,id,name)
{
 // 隐藏已经打开的菜单项
 if (preObj != null)
 {
  if (preObj == obj)
   return;
  oPopup.hide();

  // 要清空原Popup中的数据――document.write()方法是接着原来的内容往里面写,所以如果不清空会出现重复数据
  oPopup = document.parentWindow.createPopup();

  // 恢复前一个菜单项的状态
  ItemNormal(preObj);
  preObj = null;
 }
 obj.className='PopMenuItemOver';
 if (obj.cells(2).children.length > 0) //有子菜单
 {
  obj.cells(2).children(0).src = "images/ArrowRHighlight.gif";

  // 获取子菜单xml数据
  var subMenuData = obj.all.tags("xml")(0).XMLDocument;

  // 根据子菜单xml数据和当前xsl文档生成HTML
  var sHtml = subMenuData.transformNode(stylesheet);
  // 将解析出来的HTML全部输出到Popup中,在Popup中,又可以利用这些脚本再Popup……
  oPopup.document.write(sHtml);

  // 计算popup内容的实际宽度高度
  oPopup.show(0, 0, 1, 1, obj);
  var width = oPopup.document.body.scrollWidth;
  var height = oPopup.document.body.scrollHeight;
  oPopup.hide();

  // 显示菜单
  oPopup.show(obj.offsetWidth, 0, width, height, obj);

  preObj = obj;
 } else {
                returnValue(id,name);
 }
}

// 鼠标移出菜单项
function ItemOut(obj)
{
 if (oPopup.isOpen && preObj == obj) // 如果子菜单被打开则跳过
  return;
 ItemNormal(obj);
}

// 恢复到菜单项的默认状态
function ItemNormal(obj)
{
 obj.className='PopMenuItem';
 if (obj.cells(2).children.length > 0)
 {
  obj.cells(2).children(0).src = "images/ArrowR.gif";
 }
}


]]>
</script>
<table border="0" cellpadding="0" cellspacing="0" width="120" class="PopMenuOutset">
 <tr>
  <td>
   <table border="0" cellpadding="1" cellspacing="0" width="100%" class="PopMenuInset">
    <tr>
     <td class="PopMenu">
      <table border="0" cellpadding="0" cellspacing="0" width="100%" onselectstart="return false;">
       <!-- 遍历子菜单 -->
       <xsl:for-each select="menu">
        <tr height="18" οnmοuseοver="ItemOver(this)" οnmοuseοut="ItemOut(this);" >
                                                                <xsl:attribute name="title"><xsl:value-of select="@desc" /></xsl:attribute>
                                                                <xsl:attribute name="ondblclick">ItemDbClick(this,'<xsl:value-of select="@id" />','<xsl:value-of select="@fullName" />')</xsl:attribute>
               <xsl:attribute name="onclick">ItemClick(this,'<xsl:value-of select="@id" />','<xsl:value-of select="@fullName" />')</xsl:attribute>

         <td width="2" align="center">
          <IMG SRC="images/dot1.gif" WIDTH="6" HEIGHT="6" BORDER="0" ALT=""/>
         </td>
         <td>
          <xsl:value-of select="@name" />
          <xsl:if test="count(menu) > 0">
           <!-- 这里用来存储子菜单的xml数据 -->
           <xml>
            <xsl:copy-of select="."/>
           </xml>
          </xsl:if>
         </td>
         <td width="2" align="right" valign="top" style="padding-right: 6px; padding-top:4px;">
          <!-- 如果有子菜单则显示箭头 -->
          <xsl:if test="count(menu) > 0">
           <img src="images/arrowR.gif"/>
          </xsl:if>
         </td>
        </tr>
       </xsl:for-each>
      </table>
     </td>
    </tr>
   </table>
  </td>
 </tr>
</table>
</BODY>
</HTML>
</xsl:template>

</xsl:stylesheet>
 

二、生成菜单JAVASCRIPT脚本

<script language="javascript" type="">
// 装载xsl
var stylesheet = new ActiveXObject("Microsoft.XMLDOM");
stylesheet.async = false;
stylesheet.load( "menu.xsl" );
var popup;
function createPop(index) {
  // alert(index);
  var subMenuData = document.all.tags("xml")(index).XMLDocument;
  //var subMenuData = document.all.tags("xml")(index).XMLDocument;
  popup=window.createPopup();

  // 根据子菜单xml数据和当前xsl文档生成HTML
  var sHtml = subMenuData.transformNode(stylesheet);
  // 将解析出来的HTML全部输出到Popup中,在Popup中,又可以利用这些脚本再Popup……
  popup.document.write(sHtml);

  // 计算popup内容的实际宽度高度
  popup.show(0, 0, 1, 1);
  // alert(popup);
  var width = popup.document.body.scrollWidth;
  var height = popup.document.body.scrollHeight;
  //alert(index);
  popup.hide();

  // 显示菜单
  popup.show(event.screenX-5, event.screenY+10, width, height);
  //popup.show(event.screenX-5, event.screenY+10, 100, 300);
}
//二级菜单
function returnValue(id,name) {
  popup.hide();
  //name保存的主框架与树框架
  var obj=new Array();
  obj=name.split(",");
  //alert(obj[0]);
  if(obj[0]!=null && obj[0]!=""){
    href=obj[0];
    index=href.indexOf(':');
    title=href.substring(0,index);
    href=href.substring(index+1);
    //弹出窗口
    if(href.indexOf("windowOpen")>=0){
      winnew=window.open(href,'open','top=100,left=100,width=600,height=500,scrollbars=yes, resizable=yes,status=yes');
      winnew.focus();
    }else{//在main框架中显示
      //parent.document.all.main.src = obj[0];
       //:前是标题

      if(href!=""){//添加窗口
        href2="";
        if(obj[1]!=null && obj[1]!=""){
          href2= obj[1];
        }
        parent.addFrame(href,title,href2);
      }
    }
  }
  if(obj[1]!=null && obj[1]!=""){
     if(parent.document.all.left_frame.src!= obj[1]){
      parent.document.all.left_frame.src=obj[1];
    }
  }
}
//主菜单
function openTop(url){
  //alert('dd');
  var obj=new Array();
  obj=url.split(",");
  if(obj[0]!=null && obj[0]!=""){
    //退出主框架
    href=obj[0];//alert(href);
    index=href.indexOf(':');
    title=href.substring(0,index);
    href=href.substring(index+1);
    if(href.indexOf("windowTop")>=0){
      if(confirm('确定要退出系统?')){
        window.top.location = href;
      }
    }else{//在main框架中显示
      //parent.document.all.main.src = obj[0];
      //:前是标题
      if(href!=""){
         href2="";
        if(obj[1]!=null && obj[1]!=""){
          href2= obj[1];
        }
        parent.addFrame(href,title,href2);
      }
    }
  }
  if(obj[1]!=null && obj[1]!=""){
    if(parent.document.all.left_frame.src!= obj[1]){
      parent.document.all.left_frame.src=obj[1];
    }
  }
}
</script>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值