지정된 요소를 제외한 모든 LI와의 결합을 해제하도록 자바 스크립트를 강제하십시오.

아래의 코드를 수정하여 지정된 요소의 것을 제외한 모든 LI를 가져 오지 못하게 할 수 있습니까? 이유는 내가 다른 페이지에 별도의 수평 드롭 다운 메뉴가 있고 아래 코드가 페이지에 적용될 때 내 오른쪽 클릭 메뉴가 내 드롭 다운 메뉴와 유사하다는 것입니다. 내가 할 수있는 방법 단지는 지정된 요소에 자신을 적용 document.getElementById('Menu')지정된 요소를 제외한 모든 LI와의 결합을 해제하도록 자바 스크립트를 강제하십시오.

<!DOCTYPE html> 

<head> 
    <script language="javascript" type="text/javascript"> 
     var MenuObj; 
     var activeMenuItem = false; 

     //Function to highlight menu item 
     function highlightMenuItem() { 
      this.className = 'MenuHighlighted'; 
     } 

     function deHighlightMenuItem() { 
      this.className = ''; 
     } 

     //Function to show menu on click of menu item 
     function showMenu(e) { 
      var myMouseX = (e || event).clientX; 
      var myMouseY = (e || event).clientY; 
      MenuObj.style.left = myMouseX + 'px'; 
      MenuObj.style.top = myMouseY + 'px'; 
      MenuObj.style.display = 'block'; 
      return false; 
     } 

     //Function to hide menu on click of menu item 
     function hideMenu(e) { 
      if (document.all) e = event; 
      if (e.button == 0) { 
       MenuObj.style.display = 'none'; 
      } 
     } 

     function initMenu() { 
      MenuObj = document.getElementById('Menu'); 
      MenuObj.style.display = 'block'; 
      var menuItems = MenuObj.getElementsByTagName('LI'); 
      for (var no = 0; no < menuItems.length; no++) { 
       menuItems[no].onmouseover = highlightMenuItem; 
       menuItems[no].onmouseout = deHighlightMenuItem; 

       var aTag = menuItems[no].getElementsByTagName('A')[0]; 
       aTag.style.paddingLeft = '5px'; 
       aTag.style.width = (aTag.offsetWidth) + 'px'; 
       aTag.onclick = hideMenu; 
      } 
      MenuObj.style.display = 'none'; 
     } 


    </script> 
    <style type="text/css"> 
     #Menu 
     { 
      /* The menu container */ 
      border: 1px solid #808080; 
      background-color: #EDEDED; 
      margin: 0px; 
      padding: 0px; 
      width: 120px; /* Width of context menu */ 
      font-family: Trebuchet MS; 
      font-size: 8pt; 
      background-repeat: repeat-y; /* Never change these two values */ 
      display: none; 
      position: absolute; 
     } 
     #Menu a 
     { 
      /* Links in the context menu */ 
      color: #252525; 
      text-decoration: none; 
      line-height: 20px; 
      vertical-align: middle; 
      height: 20px; /* Don't change these 3 values */ 
      display: block; 
      width: 100%; 
     } 
     #Menu li 
     { 
      /* Each menu item */ 
      list-style-type: none; 
      padding: 1px; 
      margin: 1px; 
      cursor: pointer; 
     } 
     #Menu li div 
     { 
      /* Dynamically created divs */ 
      cursor: pointer; 
     } 
     #Menu .MenuHighlighted 
     { 
      background-color: #C4D0D4; 
     } 

    </style> 
</head> 
<body> 
<select style="width: 250px;" id="refdocs_list"> 
    <option value="volvo">Volvo</option> 
    <option value="saab">Saab</option> 
    <option value="mercedes">Mercedes</option> 
    <option value="audi">Audi</option> 
</select> 

    <div> 

        <ul id="Menu"> 
         <li><a href="#nogo">Delete document</a></li> 
         <div style="height:1px; background: #808080;"></div> 
         <li style="height: 5px;"><a href="#nogo">Clear all</a></li> 
        </ul> 

     <script type="text/javascript"> 
      initMenu(); 
      MenuObj.style.display = 'none'; 
      document.getElementById('refdocs_list').oncontextmenu = showMenu; 
      document.getElementById('refdocs_list').onclick = hideMenu; 
      document.documentElement.onclick = hideMenu; 
     </script> 
    </div> 
</body> 
</html>

출처

2013-02-08 John Smith

내 메뉴를 켜고 내 오른쪽 클릭 메뉴가

이 변경 #menu 같은 DIV 이름을 사용하고 짜잔 다시 작동합니다.

출처

2013-02-08 21:00:23

지정된 요소를 제외한 모든 LI와의 결합을 해제하도록 자바 스크립트를 강제하십시오.

답변

관련 문제