Question

我可能忽略了一件非常简单的事情，但我似乎找不到使用jquery mouseenter来隐藏#panel div的方法。无论我尝试什么，它都什么都不做。我已多次检查所有代码并加载了所有必需的库。我想要实现的是，如果用户将鼠标放在drop类和该类中的任何

标记上，那么#panel将保持隐藏状态。我只想在用户完全离开菜单时显示#panel。请有人指出我的错误。感谢

HTML代码

<ul id="menu">
  <li class="menu_right"><a href="#" class="drop">Contact Us</a><!-- Begin 3 columns Item -->

        <div class="dropdown_3columns align_right"><!-- Begin 3 columns container -->

            <div class="col_3">
                <h2>Which dept do you need to contact!</h2>
            </div>

            <div class="col_1">

                <ul class="greybox">
                    <li><a id="anchorTest" href="#">Technical</a></li>
                    <li><a href="#">Administrative</a></li>
                </ul>   

            </div>

            <div class="col_1">

                <ul class="greybox">
                    <li><a href="#">Billing</a></li>
                    <li><a href="#">Report Error</a></li>
                </ul>   
            <br />
            <div id="formShow">
              <form action="feedback.php" method="post" class="webform">
                <fieldset>
                <legend><span>Submit Technical Report</span></legend>
                <label for="dept">Deaprtment</label>
                <input id="dept" name="dept" class="text" type="text" />
                <label for="name">Full Name:</label>
                <input id="name" name="name" class="text" type="text" />
                <label for="email">Email address:</label>
                <input id="email" name="email" class="text" type="text" />
                <label for="position">Position:</label>
                <input id="Position" name="Position" class="text" type="text" />
                <label for="Feedback">Exact Problem:</label>
                <textarea name="Feedback" cols="20" rows="3">Please make sure that any error messages or numbers are listed here.</textarea>
                </fieldset>
                <input class="submit" type="submit"  name="submit" value="Submit Report" />
              </form>
            </div>

            </div>

            <div class="col_1">

                <ul class="greybox">
                    <li><a href="#">General</a></li>

            </div>

            <div class="col_3">
                <h2>Here are some image examples</h2>
            </div>


            <div class="col_3">
                <img src="img/02.jpg" width="70" height="70" class="img_left imgshadow" alt="" />
                <p>Maecenas eget eros lorem, nec pellentesque lacus. Aenean dui orci, rhoncus sit amet tristique eu, tristique sed odio. Praesent ut interdum elit. Maecenas imperdiet, nibh vitae rutrum vulputate, lorem sem condimentum.<a href="#">Read more...</a></p>

                <img src="img/01.jpg" width="70" height="70" class="img_left imgshadow" alt="" />
                <p>Aliquam elementum felis quis felis consequat scelerisque. Fusce sed lectus at arcu mollis accumsan at nec nisi. Aliquam pretium mollis fringilla. Vestibulum tempor facilisis malesuada. <a href="#">Read more...</a></p>
            </div>

        </div><!-- End 3 columns container -->

    </li><!-- End 3 columns Item -->


</ul>

jquery代码

$(function() {
 $("#menu .drop li").mouseenter(function(){
  $("#panel").hide();
});
 });
$(function() {
 $("#menu .drop li").mouseleave(function(){
  $("#panel").show();
});

Panel html

<div id="panel">
        <h3><a href="#">Quick Panel</a></h3>
    <div><span class="newitems">Here, you can view the last 10 stats of your users actions. For example, Logs, Intakes, Returns etc.</span><br />
  </div>
</div>

Answer 1

使用

 $("#menu .drop li")

仅适用于父类具有“drop”类的li元素，这些元素同时具有id为“menu”的父元素。我的html代码中没有看到这样的内容。使用您的选择器不会显示“.drop或li”，但它意味着“li内部.drop”

试图隐藏jquery元素但没有成功

1 个答案: