强制Javascript编码与除指定元素之外的每个LI解除关联

Force Javascript Coding to Disassociate with every LI except to specified element

本文关键字：LI 关联 元素 编码 Javascript 强制      更新时间：2023-09-26

如何修改下面的代码，使其不抓取除指定元素中的LI之外的所有LI？原因是我在另一个页面上有一个单独的水平下拉菜单，当下面的代码应用到页面上时，我的右键菜单类似于我的下拉菜单。我如何使它只应用于指定的元素：document.getElementById('Menu')

<!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>

原来我的菜单和右键菜单使用了相同的div名称#menu

改变了，瞧，它又起作用了。

相关文章：