JavaScript實現右鍵菜單（二）

BSRightItem

/**
 * <p>標題: BSRightItem</p>
 * <p>功能描述: 右鍵功能表項目。</p>
 * <p>作者: BinaryStar原創B/S架構</p>
 * <p>版本: 0.1</p>
 * <p>建立日期: 2005-12-21</p>
 */

function BSRightItem(pid, areaIndex, areaId,  pIndex, index, text, jsfun, img, disabled)...{
  this.pid = pid||"BSRightMenu_1";//BS右鍵菜單對象ID
  this.areaIndex = areaIndex;//右鍵塊索引
  this.areaId = areaId||"";//BS右鍵菜單塊ID
  this.pIndex = pIndex;//父功能表項目索引

  this.level = 0;//樹的深度
  this.index = index;//本功能表項目索引
  this.id = this.areaId + "_item_" + this.index;//ID
  this.text = text || "BS功能表項目";//功能表項目文字
  this.jsfun = jsfun;//功能表項目js函數
  this.img = img||"";//功能表項目圖片
  this.childList = new Array();//該功能表項目包含的子功能表項
  this.isSperator = false;//是否是分隔字元
  this.thisItemIndex = -1;//當前滑鼠所在的子功能表項索引。
  this.disabled = disabled || false;//該功能表項目是否可用
  this.childIsShow = false;//孩子功能表正在展現
  this.key = "";//右鍵功能表項目的key;
  this.body = null;//該功能表項目的對象；
  this.isError = false;//該節點點擊出錯

  this.setDisabled = function (flag)...{
    if (flag)...{
      this.disabled = true;
    }
    else...{
      this.disabled = false;
    }
  }

  //添加子功能表項
  this.addItem = function (text, jsfun, img, disabled)...{
   var rmObj = eval(this.pid);
 return rmObj.itemAreaList[this.areaIndex].addItem(this.index, text, jsfun, img, disabled);
  }

  //功能表項目的展現
  this.show = function()...{
   var rmObj = eval(this.pid);
    var htmlStr = "";
   var pName = rmObj.getRMName(this.level);
    htmlStr += "<tr id=""+this.id+"_tr" style=""+bs_rm_out+""";
    htmlStr += " onmouseover=""+pName+".itemAreaList["+this.areaIndex+"].itemList["+this.index+"].doOnmouseover(event, this)"";
    htmlStr += " onmouseout=""+pName+".itemAreaList["+this.areaIndex+"].itemList["+this.index+"].doOnmouseout(event, this)"";
    if (!this.isSperator && !this.disabled)...{
      htmlStr += " onmouseup=""+pName+".itemAreaList["+this.areaIndex+"].itemList["+this.index+"].doOnmouseup(event, this)"";
      htmlStr += " onmousedown=""+pName+".itemAreaList["+this.areaIndex+"].itemList["+this.index+"].doOnmousedown(event, this)"";
    }
    else...{
      htmlStr += " onmouseup="event.cancelBubble=true;return false;"";
      htmlStr += " onmousedown="event.cancelBubble=true;return false;"";
    }
    htmlStr += " onclick=window.event.cancelBubble=true;return false;";
    htmlStr += ">";
    //圖片
    if (!this.isSperator)...{
      htmlStr += "<td align="right" ";
      if (this.img.Trim() != "")...{
        htmlStr += "style="width:22px;height:22px;";
        htmlStr += "background: url("+rmObj.imagePath+this.img+");";
        htmlStr += "background-repeat: no-repeat;";
        htmlStr += "background-attachment: no-fixed;";
        htmlStr += "background-position: right;"";
        htmlStr += " valign="middle">&nbsp;&nbsp;&nbsp;</td>";
      }
      else...{
        htmlStr += "style="width:2px;height:22px;";
        htmlStr += " valign="middle">&nbsp;</td>";
      }
      //文字
      var tempText = this.text;
      var isLong = false;
      var cn = 0;
      if (tempText.match(/[^ -~]/g) != null)...{
       cn = tempText.match(/[^ -~]/g).length;
      }

      if ((tempText.length-cn)+cn*2 >= 18)...{
       if (cn <= 3)...{
        tempText = tempText.substring(0, 18)+"...";
       }
       else ...{
        tempText = tempText.substring(0, 10)+"...";
       }
       isLong = true;
      }
      htmlStr += "<td valign="middle" onmouseover="function(){return false;}"";
      if (isLong)...{
       htmlStr += " title=""+this.text+""";
      }
      if (this.disabled)...{
        htmlStr += " style="color:Gray;white-space:nowrap;word-break:word-break ;"";
      }
      htmlStr += "><nobr onmouseover="function(){return false;}">"+tempText+"&nbsp;&nbsp;</nobr></td>";
      //存在孩子時顯示箭頭。
      htmlStr += "<td style='font-family: webdings;'>";
      if (this.childList.length > 0)...{
        htmlStr += "4";
      }
        htmlStr += "</td>";
    }
    else...{
      //分隔字元
      htmlStr += "<td colspan="3" height="5"><hr style=""+bs_rm_sperator+""/></td>";
    }
    htmlStr += "</tr>";
    return htmlStr;
  }

  //設定圖片的背景色
  this.setImgSelect = function(elmObj, flag)...{
   //文字背景
   if (!flag)...{
   elmObj.style.cssText = bs_rm_out;
   }
   else if (this.isError)...{
   elmObj.style.cssText = bs_rm_error;
   }
   else ...{
   elmObj.style.cssText = bs_rm_over;
   }
   //圖片背景
    if (this.img.Trim() != "")...{
      if (flag)...{
        elmObj.cells[0].style.backgroundColor = "#8989bc";
      }
      else...{
        elmObj.cells[0].style.backgroundColor = "";
      }
    }
  }

  //展現下一級菜單
 this.showChildren = function(event)...{
    var pobj = eval(this.pid);
   var the_obj = event.srcElement.parentElement;
   if (the_obj.tagName == "TD")...{
    the_obj = the_obj.parentElement;
   }
   if (the_obj.id == this.id+"_tr_str")...{
    the_obj = the_obj.parentElement;
   }
    if (this.childList.length > 0 && !this.disabled)...{
      //建立popup
   if (pobj.popupList[this.level+1] == null)...{
    pobj.popupList[this.level+1] = pobj.popupList[this.level].document.parentWindow.createPopup();
    pobj.popupList[this.level+1].document.oncontextmenu = function()...{return false;};
    if (pobj.popupList[this.level+1].document.charset != "GB2312")...{
     try...{
      pobj.popupList[this.level+1].document.charset="GB2312";
     }
     catch(ex)...{
     }
    }
   }
   pobj.popupList[this.level+1].document.body.innerHTML = "";
   pobj.popupList[this.level+1].show(0,0,1,1);

      var htmlStr = "<table border='0' cellspacing='0'>";
      for (var i=0; i<this.childList.length; i++)...{
        htmlStr += pobj.itemAreaList[this.areaIndex].itemList[this.childList[i]].show();
      }
      htmlStr += "</table>";
      var levelObj = null;
      levelObj = pobj.popupList[this.level+1].document.getElementById(this.pid+"_rm_"+(this.level+1));
      //level+1層沒有建立
      if (levelObj == null)...{
        levelObj = pobj.popupList[this.level+1].document.createElement("div");
        levelObj.id = this.pid+"_rm_"+(this.level+1);
        levelObj.style.cssText = bs_rm_div;
        pobj.popupList[this.level+1].document.body.appendChild(levelObj);
      }
      htmlStr += "<input type="hidden" id=""+pobj.id+"_selectItem" name=""+pobj.id+"_selectItem" value="-1"/>";
      //alert(htmlStr);
      levelObj.innerHTML = htmlStr;
      levelObj.style.display = "block";
      this.childIsShow = true;
   var width = levelObj.offsetWidth;
   var Height = levelObj.offsetHeight;
      //定位
   var left = GetDefineX(the_obj)+the_obj.offsetWidth;
   var top = GetDefineY(the_obj);
      if(((left+pobj.popupList[this.level].document.parentWindow.screenLeft)+levelObj.offsetWidth) >= window.screen.availWidth)...{
        left -= (the_obj.offsetWidth + levelObj.offsetWidth-4);
      }
      if(((top+pobj.popupList[this.level].document.parentWindow.screenTop)+levelObj.offsetHeight) > window.screen.availHeight)...{
        top -= (levelObj.offsetHeight-the_obj.offsetHeight);
      }
   pobj.popupList[this.level+1].show(left, top, width, Height, pobj.popupList[this.level].document.body);
    }
   else...{
    pobj.hiddenAll(this.level+1);
  }
 }

  //滑鼠按下動作
  this.doOnmousedown = function(event, elmObj)...{
    event.cancelBubble=true;
    if (this.childList.length <= 0)...{
      elmObj.setCapture();
    }
    return false;
  }
  //滑鼠彈起動作
  this.doOnmouseup = function(event, elmObj)...{
    event.cancelBubble=true;
    if (this.childList.length <= 0)...{
      var pobj = eval(this.pid);
      pobj.setRMIndex(this.areaIndex, this.index);
      elmObj.releaseCapture();
      if (this.jsfun.Trim() != "")...{
        try...{
         eval(this.jsfun);
       this.isError = false;
        }
        catch(e)...{
         var errStr = "*^_^*恭喜你中招了!  "+e.name+":"+e.message+"  節點操作方法 "+this.jsfun+" 發生嚴重錯誤！";
       elmObj.style.cssText = bs_rm_error;
       this.isError = true;
       elmObj.title = errStr;
          return;
        }
      }
      pobj.hiddenAll(0);
    }
    return false;
  }
  //滑鼠移入動作
  this.doOnmouseover = function(event, elmObj)...{
    event.cancelBubble=true;
    if (!this.isSperator)...{
      this.setImgSelect(elmObj, true);
    }
    //改變其他的項的高選
    var pobj = eval(this.pid);
    if (!pobj.itemAreaList[this.areaIndex].setIndexItem(this.level, this.index))...{
     this.showChildren(event);
    }
   else if (this.childList.length <= 0)...{
     pobj.hiddenAll(this.level+1);
  }
  pobj.setRMIndex(this.areaIndex, this.index);
    return false;
  }

  //滑鼠移出動作
  this.doOnmouseout = function(event, elmObj)...{
    event.cancelBubble=true;
    if (!this.isSperator && !this.childIsShow)...{
      this.setImgSelect(elmObj, false);
    }
    return false;
  }
}

 

本文來自CSDN部落格，轉載請標明出處：http://blog.csdn.net/mynickel2000/archive/2006/09/12/1214623.aspx