mouseEnter和mouseLeave在JSP中不起作用

时间:2013-08-29 08:19:17

标签: jquery jsp

我写过这个JavaScript

<script>
   $(document).ready(function(){
      $(".sidebarmenu").mouseenter(function(){
        $(".sidebarmenu").css('display','block');  
   });
   $(".sidebarmenu").mouseleave(function(){
  $(".sidebarmenu").css('display','enter');
   });
 });
</script>

隐藏我的JSP列表。

<div id="pageNav">
<div class="sidebarmenu">
    <ul>
         <li>......</li>
         <li>......</li>
    </ul>
 </div>
</div>

我哪里出错了?代码无效..

3 个答案:

答案 0 :(得分:0)

而不是:

$(".sidebarmenu").css('display','enter');

$(".sidebarmenu").css('display','none');

或者

$(".sidebarmenu").hide();

但是此代码会隐藏$(“。sidebarmenu”),因此您无法在此之后进行鼠标输入

答案 1 :(得分:0)

FIDDLE

<script type="text/javascript">

   $(document).ready(function(){

     $(".sidebarmenu").mouseenter(function(){

         $(this).find('ul').show('slow');
     });

     $(".sidebarmenu").mouseleave(function(){

         $(this).find('ul').hide('slow');  
     });
 });

</script>

<强>更新

尝试在div中添加一些文字

<div class="sidebarmenu">
   my div
    <ul>
         <li>......</li>
         <li>......</li>
    </ul>
 </div>

当div中没有​​元素显示时,似乎mouseenter事件无法找到目标。

或尝试添加边框或向sidebarmenu div

添加背景颜色

答案 2 :(得分:0)

看看这个小提琴

<强> FIDDLE

$(document).ready(function(){
       $(".sidebarmenu").mouseover(function(){
            alert('over');  
       });
       $(".sidebarmenu").mouseleave(function(){
          alert('leave');  
       });
 });