个人中心
gpt4 book ai didi

javascript - 什么是“menu2”的实现

转载 作者：行者123 更新时间：2023-11-30 10:31:33 24 4
gpt4 key购买 nike

在下面的下拉菜单中，有 onmouseover="openelement('menu2')", onmouseover="openelement('menu3')"调用的 java 脚本函数 等等。我不明白这个 'menu2' , 'menu3' 是什么。有人可以解释一下吗？整个程序如下。

下拉菜单 CSS 和 JS

    <!--The CSS code.-->
    <style type="text/css" media="screen">

            #nav {
                margin: 0;
                padding: 0;
            }

            #nav li {
                list-style: none;
                float: left;
            }

            #nav li a {
                display: block;
                margin: 0 1px 0 0;
                padding: 4px 10px;
                width: 80px;
                background: lavender;
                color: black;
                text-align: center;
                text-decoration:none;
            }

            #nav li a:hover {
                background: grey;
            }

            #nav ul {
                position: absolute;
                visibility: hidden;
                margin: 0;
                padding: 0;
                border: 1px solid #ffffff
            }

            #nav  ul li a{
                    position: relative;
                    margin: 0;
                    padding: 5px 10px;
                    width: 80px;
                    text-align: left;
                    background: lavender;
                    color: #000000;
                }   

            #nav li ul li {
                clear: both;
            }
    </style>
    <!--The end of the CSS code.-->

    <!--The Javascript menu code.-->
    <script type="text/javascript">
        //variables' declaration

        var timeout = 500;
        var timer   = 0;
        var item    = 0;

        //function for opening of submenu elements
        function openelement(num)
        {    
            keepsubmenu()
            //checks whether there is an open submenu and makes it invisible
            if(item){ item.style.visibility = 'hidden';}
                //shows the chosen submenu element
                item = document.getElementById(num);
                item.style.visibility = 'visible';
        }

        // function for closing of submenu elements
        function closeelement()
        {
            //closes the open submenu elements and loads the timer with 500ms
            timer = window.setTimeout("if(item) item.style.visibility = 'hidden';",500);
        }

        //function for keeping the submenu loaded after the end of the 500 ms timer
        function keepsubmenu()
        {
            if(timer){
                window.clearTimeout(timer);
                timer = null;
            }
        }

        //hides the visualized menu after clicking outside of its area and expiring of the loaded timer
        document.onclick = closeelement;

    </script>
    <!--END of CSS code-->

</head>
<body>
    <!--HTML code for the menu -->
    <ul id="nav">
        <li><a href="http://www.sci.sjp.ac.lk/lms/file.php/233/dropDownJs.html#">Home</a>
        </li>
        <li><a href="http://www.sci.sjp.ac.lk/lms/file.php/233/dropDownJs.html#" onmouseover="openelement(&#39;menu2&#39;)" onmouseout="closeelement()">Tutorials</a>
            <ul id="menu2" onmouseover="keepsubmenu()" onmouseout="closeelement()" style="visibility: hidden; ">
                <li><a href="http://www.sci.sjp.ac.lk/lms/file.php/233/dropDownJs.html#">CSS</a></li>
                <li><a href="http://www.sci.sjp.ac.lk/lms/file.php/233/dropDownJs.html#">Flash</a></li>
            </ul>
        </li>
        <li><a href="http://www.sci.sjp.ac.lk/lms/file.php/233/dropDownJs.html#" onmouseover="openelement(&#39;menu3&#39;)" onmouseout="closeelement()">More</a>
            <ul id="menu3" onmouseover="keepsubmenu()" onmouseout="closeelement()">
               <li><a href="http://www.sci.sjp.ac.lk/lms/file.php/233/dropDownJs.html#">About Us</a></li>
                <li><a href="http://www.sci.sjp.ac.lk/lms/file.php/233/dropDownJs.html#">Contact Us</a></li> 
            </ul>
        </li>
    </ul>
    <div style="clear:both"></div>
    <!--the end of the HTML code for the menu -->

最佳答案

39 是撇号和 &#39; 的 ASCII 码是将 ASCII 字符插入 HTML 的语法

此语法主要用于按原样插入在 HTML/JavaScript 中有意义的字符(并防止跨站点脚本攻击)- 例如 <和 >字符

在你的情况下，你应该替换 '在带有撇号 (') 的事件处理程序中出现，因此它在 Javascript 中的行为应该如此

关于javascript - 什么是“menu2”的实现，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16619989/

24 4 0
文章推荐： javascript检查这种格式的字符串
文章推荐： java - 如何使用 Dagger2 和 MVP 模式调用模型文件中的 Presenter 方法
文章推荐： SwiftUI:使用 ObservableObject 模型 View 中的函数初始化数据时出错
文章推荐： java - 为什么我的哈希集包含重复项？
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com