台灣最大程式設計社群網站
線上人數
1680
 
會員總數:246494
討論主題:190002
歡迎您免費加入會員
討論區列表 >> Java Script/ Node.js >> Javascript下拉選單多產生項目內容
[]  
[我要回覆]
回應主題 加入我的關注話題 檢舉此篇討論 將提問者加入個人黑名單
Javascript下拉選單多產生項目內容
價值 : 0 QP  點閱數:1779 回應數:0
樓主

allenrung
初學者
5 4
32 7
發送站內信

請問在使用Javascript 寫一menu下拉式選單
Load進網頁後在綱頁下方會多產生選單內容
Focus進綱頁內後又可不見(恢愎正常)
請問各位先進有遇到相同問題嗎?

<!--
var isDOM = document.getElementById ? true : false; 
var isIE4 = (document.all && !isDOM) ? true : false;
var isNS4 = document.layers ? true : false;

function Menu(isVert, popInd, x, y, width, overCol, backCol, borderClass, textClass) 
{
  this.isVert = isVert;
  this.popInd = popInd;
  this.x = x;
  this.y = y;
  this.width = width;
  this.overCol = overCol;
  //document.writeln("overCol" + overCol);
  this.backCol = backCol;
  this.borderClass = borderClass;
  //document.writeln("borderclass" + borderClass);
  this.textClass = textClass;
  this.parentMenu = null;
  this.parentItem = null;
  this.ref = null;
  this.fontSize=8;
}
function Item(text, href, frame, length, spacing, target) 
{
  this.text = text;
  this.href = href;
  this.frame = frame;
  this.length = length;
  this.spacing = spacing;
  this.target = target;
  this.ref = null;
}
function getRef(id) 
{
  if (isDOM) return document.getElementById(id);
  if (isIE4) return document.all[id];
  if (isNS4) return document.layers[id];
}
function getSty(id) 

        return (isNS4 ? getRef(id) : getRef(id).style); 
}

var popTimer = 0;
var litNow = new Array();
function popOver(menuNum, itemNum) 
{
  clearTimeout(popTimer);
  hideAllBut(menuNum);
  litNow = getTree(menuNum, itemNum);
  changeCol(litNow, true);
  targetNum = menu[menuNum][itemNum].target;
  if (targetNum > 0) 
  {
    thisX = parseInt(menu[menuNum][0].ref.left) + parseInt(menu[menuNum][itemNum].ref.left);
    thisY = parseInt(menu[menuNum][0].ref.top) + parseInt(menu[menuNum][itemNum].ref.top);
    with (menu[targetNum][0].ref) 
    {
      left = parseInt(thisX + menu[targetNum][0].x);
      top = parseInt(thisY + menu[targetNum][0].y);
      visibility = 'visible';
    }
  }
}
function popOut(menuNum, itemNum) 
{
  if ((menuNum == 0) && !menu[menuNum][itemNum].target) hideAllBut(0);
  else popTimer = setTimeout('hideAllBut(0)', 500);
}
function getTree(menuNum, itemNum) 
{
  itemArray = new Array(menu.length);
  while (1) 
  {
    itemArray[menuNum] = itemNum;
    if (menuNum == 0) return itemArray;
    itemNum = menu[menuNum][0].parentItem;
    menuNum = menu[menuNum][0].parentMenu;
  }
  return "";
}

function changeCol(changeArray, isOver) 
{
  for (menuCount = 0; menuCount < changeArray.length; menuCount++) 
  {
    if (changeArray[menuCount]) 
    {
      newCol = isOver ? menu[menuCount][0].overCol : menu[menuCount][0].backCol;
      with (menu[menuCount][changeArray[menuCount]].ref) 
      {
        if (isNS4) bgColor = newCol;
        else backgroundColor = newCol;
      }
    }
  }
}
function hideAllBut(menuNum) 
{
  var keepMenus = getTree(menuNum, 1);
  for (count = 0; count < menu.length; count++)
  if (!keepMenus[count]) menu[count][0].ref.visibility = 'hidden';
  changeCol(litNow, false);
}

function writeMenus() //add menuitem
{
  for (currMenu = 0; currMenu < menu.length; currMenu++)
  with (menu[currMenu][0]) 
  {
    var str = '', itemX = 0, itemY = 0;
    for (currItem = 1; currItem < menu[currMenu].length; currItem++)
    with (menu[currMenu][currItem]) 
    {
      var itemID = 'menu' + currMenu + 'item' + currItem;
      var w = (isVert ? width : length);
      var h = (isVert ? length : width);
      if (isDOM || isIE4) 
      {
        str += '<div id="' + itemID + '" style="position: absolute; left: ' + itemX + '; top: ' + itemY + '; width: ' + w + '; height: ' + h + '; fontsize:10' + '; visibility: inherit; ';
        if (backCol) str += 'background: ' + backCol + '; ';
        str += '" ';
      }
      if (isNS4) 
      {
        str += '<layer id="' + itemID + '" left="' + itemX + '" top="' + itemY + '" width="' +  w + '" height="' + h + '" visibility="inherit" ';
        if (backCol) str += 'bgcolor="' + backCol + '" ';
      }
      if (borderClass) str += 'class="' + borderClass + '" ';
      str += 'onMouseOver="popOver(' + currMenu + ',' + currItem + ')" onMouseOut="popOut(' + currMenu + ',' + currItem + ')">';
      str += '<table width="' + (w - 8) + '" border="0" cellspacing="0" cellpadding="' + (!isNS4 && borderClass ? 3 : 0) + '"><tr><td align="left" height="' + (h - 7) + '">' ;
      if (href!="")
      {
              str+='<font size="2"> <a class="' + textClass + '" href="' + href + '"' + (frame ? ' target="' + frame + '">' : '>') + text + '</a></font></td>';
      }
      else
      {
            str+='<p align="center"> <font size="2">' + text + '</font></td>';
      }
      if (target > 0) 
      {
        menu[target][0].parentMenu = currMenu;
        menu[target][0].parentItem = currItem;
        if (popInd) str += '<td class="' + textClass + '" align="right">' + popInd + '</td>';
      }
      str += '</tr></table>' + (isNS4 ? '</layer>' : '</div>');
      if (isVert) itemY += length + spacing;
      else itemX += length + spacing;
    }
    if (isDOM) 
    {
      var newDiv = document.createElement('div');
      document.getElementsByTagName('body').item(0).appendChild(newDiv);
      newDiv.innerHTML = str;
      ref = newDiv.style;
      ref.position = 'absolute';
      ref.visibility = 'visible';
    }
    if (isIE4) 
    {
      document.body.insertAdjacentHTML('beforeEnd', '<div id="menu' + currMenu + 'div" ' + 'style="position: absolute; visibility: hidden">' + str + '</div>');
      ref = getSty('menu' + currMenu + 'div');
    }
    if (isNS4) 
    {
      ref = new Layer(0);
      ref.document.write(str);
      ref.document.close();
    }
    for (currItem = 1; currItem < menu[currMenu].length; currItem++) 
    {
      itemName = 'menu' + currMenu + 'item' + currItem;
      if (isDOM || isIE4) menu[currMenu][currItem].ref = getSty(itemName);
      if (isNS4) menu[currMenu][currItem].ref = ref.document[itemName];
    }
  }
  with (menu[0][0]) 
  {
    ref.left = x;
    ref.top = y;
        //Ref.visibility = 'visible';
        //ref.visibility = 'hidden';
  }
}

//判斷日期展示區
function getDate()
{
        var vn="Microsoft Internet Explorer";
        var some;
        
        if(navigator.appName!=vn)
                some="11";
        else
                some="1911";
                
                var enabled = 0; today = new Date();
                var day; var date1;
                if(today.getDay()==0) day = "星期日"
                if(today.getDay()==1) day = "星期一"
                if(today.getDay()==2) day = "星期二"
                if(today.getDay()==3) day = "星期三"
                if(today.getDay()==4) day = "星期四"
                if(today.getDay()==5) day = "星期五"
                if(today.getDay()==6) day = "星期六"
                //document.fgColor = "000000";
                
        date1 = (today.getYear()) + " /" + (today.getMonth() + 1 ) + " / " + today.getDate()  + " "+ day +"";
                //document.write("<CENTER><TABLE BORDER=3 BGCOLOR=000000><TH><FONT COLOR=ccff00>")
                //document.write("<CENTER>" + date.fontsize(3) + "</CENTER>");
                //document.write("</FONT></TH></TABLE></center><P>")
                //document.write(date)
                return date1;
}

//var defOC = '#F9E473';
var defOC = '#00ff4d';
//var defBC = 'Silver';
//var defBC = '#0cc735';
//var defBC = '#00Fe00';
var defBC ='#00bfff';

var menu = new Array();
var Getdate1;
Getdate1 = getDate();
var host1="http://" + document.location.host + "/chinese/"; //get host address
menu[0] = new Array();
menu[0][0] =  new  Menu(false, '',  130, 90, 20,  defOC,  defBC, 'itemBorder', 'Times New Roman'); 
menu[0][1] =  new Item('關於台彎納米', '', '',  100,1, 1); 
menu[0][2] =  new Item('產品介紹', '', '',  80, 1, 2); 
menu[0][3]  = new Item('技術專區', '', '', 70, 1, 11); 
menu[0][4] = new Item('納米新聞', '',  '', 70, 1, 14); 
menu[0][5]  = new Item('人力資源', '',  '', 70, 1, 15);  
menu[0][6] = new Item('聯絡我們', '', '', 70,  1, 16); 
menu[0][7] = new Item('今天是' + Getdate1, '', '', 162,  1, 0); 
//menu[0][7] = new  Item('加到我的最愛', '#',  '', 110,  1, 0);  
//menu[0][8] =  new Item('English',  '#', '',  55, 1,  0);
menu[1] = new Array();
menu[1][0] = new Menu(true, '&gt;', 0, 23, 100, defOC, defBC, 'itemBorder', 'itemText');
menu[1][1] = new Item('公司背景', '', '', 20, 1, 3);
menu[1][2] = new Item('經營範籌', '', '', 20, 1, 4);
menu[1][3] = new Item('品質政策', host1 + 'quality/quality-A-3.htm', '', 20, 1, 0);
menu[1][4] = new Item('知識管理', host1 + 'KM/KM-A-4.htm', '', 20, 1, 0);
menu[1][5] = new Item('資訊管理', 'http://www.skrnet.com/', '', 20, 1, 0);
menu[1][6] = new Item('公司地圖', 'http://www.skrnet.com/', '', 20, 1, 0);
menu[2] = new Array();
menu[2][0] = new Menu(true, '&gt;', 0, 23, 80, defOC, defBC, 'itemBorder', 'itemText');
menu[2][1] = new Item('Inkjet ', 'http://www.skrnet.com/skrjs/index01.htm', '', 25, 0, 5);
menu[2][2] = new Item('CF ', 'http://www.skrnet.com/skrjs/index02.htm', '', 25, 0, 6);
menu[2][3] = new Item('3C及傳統產業 ', 'http://www.skrnet.com/skrtalk/', '', 25, 10, 7);
menu[2][4] = new Item('光電 ', 'http://www.skrnet.com/skrtalk/', '', 25, 0, 8);
menu[2][5] = new Item('表改 ', 'http://www.skrnet.com/skrtalk/', '', 25, 0, 9);
menu[2][6] = new Item('OEM ', 'http://www.skrnet.com/skrtalk/', '', 25, 0, 0);
menu[2][7] = new Item('將開發 ', 'http://www.skrnet.com/skrtalk/', '', 25, 0,10);

menu[3] = new Array();
menu[3][0] = new Menu(true, '&gt;', 101, 0, 130, defOC, defBC, 'itemBorder', 'itemText');
menu[3][1] = new Item('•公司簡介',host1 + 'CampanyBG/CampanyBG-A-1-1.htm', '', 20, 0, 0);
menu[3][2] = new Item('•董事長的話', host1+ 'CampanyBG/CampanyBG-A-1-2.htm', '', 20, 0, 0);
menu[3][3] = new Item('•企業願景與價值', host1+ 'CampanyBG/CampanyBG-A-1-3.htm', '', 20, 0, 0);
menu[3][4] = new Item('•經營理念', host1+ 'CampanyBG/CampanyBG-A-1-4.htm','', 20, 0, 0);

menu[4] = new Array();
menu[4][0] = new Menu(true, '', 101, 0, 85, defOC, defBC, 'itemBorder', 'itemText');
menu[4][1] = new Item('•營業項目', host1+ 'prospectus/prospectus-A-2-1.htm', '', 22, 0, 0);
menu[4][2] = new Item('•產能分析', host1+ 'prospectus/prospectus-A-2-2.htm', '', 22, 0, 0);
menu[5] = new Array();
menu[5][0] = new Menu(true, '', 81, 0, 70, defOC, defBC, 'itemBorder', 'itemText');
menu[5][1] = new Item('•油性', 'http://www.skrnet.com/project.htm', '', 22, 0, 0);
menu[5][2] = new Item('•水性', 'http://www.skrnet.com/p04.htm', '', 22, 0, 0);
menu[5][3] = new Item('•UV', 'http://www.skrnet.com/p04.htm', '', 22, 0, 0);
menu[6] = new Array();
menu[6][0] = new Menu(true, '&gt;', 81, 0, 90, defOC, defBC, 'itemBorder', 'itemText');
menu[6][1] = new Item('•R.G.B.Y.', 'http://www.skrnet.com/project.htm', '', 22, 0, 0);
menu[6][2] = new Item('•BM', 'http://www.skrnet.com/p04.htm', '', 22, 0, 0);
menu[7] = new Array();
menu[7][0] = new Menu(true, '&gt;', 81, 0, 105, defOC, defBC, 'itemBorder', 'itemText');
menu[7][1] = new Item('•透鐵', 'http://www.skrnet.com/project.htm', '', 22, 0, 12);
menu[7][2] = new Item('•Pigment', 'http://www.skrnet.com/p04.htm', '', 22, 0, 13);
menu[7][3] = new Item('•負離子.奈米銀.氧化鋅', 'http://www.skrnet.com/p04.htm', '', 22, 0, 0);
menu[8] = new Array();
menu[8][0] = new Menu(true, '&gt;', 81, 0, 120, defOC, defBC, 'itemBorder', 'itemText');
menu[8][1] = new Item('•AG.AR', 'http://www.skrnet.com/project.htm', '', 22, 0, 0);
menu[8][2] = new Item('•ATO.ITO', 'http://www.skrnet.com/p04.htm', '', 22, 0, 0);
menu[8][3] = new Item('•SiO<sub>2</sub>.ZnO.CeO<sub>2</sub>', 'http://www.skrnet.com/p04.htm', '', 25, 0, 0);
menu[8][4] = new Item('•Al<sub>2</sub>.O<sub>3</sub>.ZrO<sub>2</sub>', 'http://www.skrnet.com/p04.htm', '', 22, 0, 0);
menu[9] = new Array();
menu[9][0] = new Menu(true, '&gt;', 81, 0, 120, defOC, defBC, 'itemBorder', 'itemText');
menu[9][1] = new Item('•SiO<sub>2</sub>.Al<sub>2</sub>O<sub>3</sub>', 'http://www.skrnet.com/project.htm', '', 22, 0, 0);
menu[10] = new Array();
menu[10][0] = new Menu(true, '&gt;', 81, 0, 100, defOC, defBC, 'itemBorder', 'itemText');
menu[10][1] = new Item('•昇華型染料', 'http://www.skrnet.com/project.htm', '', 22, 0, 0);
menu[10][2] = new Item('•夜光粉', 'http://www.skrnet.com/p04.htm', '', 22, 0, 0);
menu[11] = new Array();
menu[11][0] = new Menu(true, '&gt;', 0, 23, 115, defOC, defBC, 'itemBorder', 'itemText');
menu[11][1] = new Item('Coretech', 'http://www.skrnet.com/project.htm', '', 22, 0, 0);
menu[11][2] = new Item('CF能量區', 'http://www.skrnet.com/p04.htm', '', 22, 0, 0);
menu[11][3] = new Item('TexTure應用', 'http://www.skrnet.com/p04.htm', '', 25, 0, 0);
menu[11][4] = new Item('Coating產業應用', 'http://www.skrnet.com/p04.htm', '', 22, 0, 0);
menu[11][5] = new Item('IJP技術區', 'http://www.skrnet.com/p04.htm', '', 22, 0, 0);
menu[11][6] = new Item('光電AG/AR應用', 'http://www.skrnet.com/p04.htm', '', 22, 0, 0);
menu[12] = new Array();
menu[12][0] = new Menu(true, '&gt;', 106, 0, 80, defOC, defBC, 'itemBorder', 'itemText');
menu[12][1] = new Item('•水性', 'http://www.skrnet.com/project.htm', '', 22, 0, 0);
menu[12][2] = new Item('•油性', 'http://www.skrnet.com/project.htm', '', 22, 0, 0);
menu[13] = new Array();
menu[13][0] = new Menu(true, '&gt;', 106, 0, 130, defOC, defBC, 'itemBorder', 'itemText');
menu[13][1] = new Item('•C.M.Y.K.G.V.W', 'http://www.skrnet.com/project.htm', '', 22, 0, 0);
menu[14] = new Array();
menu[14][0] = new Menu(true, '&gt;', 0, 23, 100, defOC, defBC, 'itemBorder', 'itemText');
menu[14][1] = new Item('大事紀', 'http://www.skrnet.com/project.htm', '', 22, 0, 0);
menu[14][2] = new Item('活動集錦', 'http://www.skrnet.com/project.htm', '', 22, 0, 0);
menu[14][3] = new Item('最新新聞', 'http://www.skrnet.com/project.htm', '', 22, 0, 0);
menu[14][4] = new Item('歷年得獎記錄', 'http://www.skrnet.com/project.htm', '', 22, 0, 0);
menu[15] = new Array();
menu[15][0] = new Menu(true, '&gt;', 0, 23, 70, defOC, defBC, 'itemBorder', 'itemText');
menu[15][1] = new Item('教育訓練', 'http://www.skrnet.com/project.htm', '', 22, 0, 0);
menu[15][2] = new Item('員工福利', 'http://www.skrnet.com/project.htm', '', 22, 0, 0);
menu[15][3] = new Item('求才訊息', 'http://www.skrnet.com/project.htm', '', 22, 0, 0);
menu[15][4] = new Item('線上履歷', 'http://www.skrnet.com/project.htm', '', 22, 0, 0);
menu[16] = new Array();
menu[16][0] = new Menu(true, '&gt;', 0, 23, 70, defOC, defBC, 'itemBorder', 'itemText');
menu[16][1] = new Item('表格', 'http://www.skrnet.com/project.htm', '', 22, 0, 0);

var popOldWidth = window.innerWidth;
nsResizeHandler = new Function('if (popOldWidth != window.innerWidth) location.reload()');
if (isNS4) document.captureEvents(Event.CLICK);
document.onclick = clickHandle;
function clickHandle(evt) {
  if (isNS4) document.routeEvent(evt);
  hideAllBut(0);
}
function moveRoot() {
  with (menu[0][0].ref) left = (parseInt(left) < 100) ? 100 : 5;
}
// -->

本篇文章發表於2004-12-24 10:44
目前尚無任何回覆
   

回覆
如要回應,請先登入.