Question

我有一个嵌套列表除非您在该页面上，否则nav-ul是隐藏的，在这种情况下，jQ会添加所选的类。
我编写了一个jQuery脚本来处理当前位置的突出显示，但是当我将鼠标悬停在顶层li上时，我遇到的问题是隐藏了nav-ul。

第1项 |第2项|第3项|
项目1.1 |项目1.2 |项目1.3 |

<ul id="nav">
  <li><a href="one.html">Item 1</a>
    <ul class="nav-ul selected">
      <li>Item 1.1</li>
      <li>Item 1.2</li>
      <li>Item 1.3</li>
    </ul>
  </li>
  <li><a href="two.html">Item 2</a>
    <ul class="nav-ul">
      <li>Item 2.1</li>
      <li>Item 2.2</li>
      <li>Item 2.3</li>
    </ul>
  </li>
  <li><a href="three.html">Item 3</a>
    <ul class="nav-ul">
      <li>Item 3.1</li>
      <li>Item 3.2</li>
      <li>Item 3.3</li>
    </ul>
  </li>
</ul>

希望有道理......

请原谅我的代码，这是我第一次尝试jQuery。

$(function(){
    var pathFileName = (location.pathname);             // Gets the path and filename from the URL. Includes the leading slash
                                                        // eg:/water/index.shtml
//  $('#alert').append(pathFileName + '<br />');
    var splitPath    = location.pathname.split("/");    // split pathFileName at the '/' into an array 
    var i            = pathFileName.length-1;
/* add index.shtml if pathFileName ends in slash */
    if (pathFileName.substr(i) == '/'){
        pathFileName = pathFileName + 'index.shtml';
    }

    var mainSelector = "#horizontalNavigation";         // The id of the first level ul
    var subSelector  = ".nav-ul";                       // The class of the second level ul
    if ( pathFileName ) {
        if (splitPath.length >= 1){
            var pathOnly = "";
            for (var i=0; i < splitPath.length-1; i++){ // Rebuild the path from the array without the filename
                pathOnly += splitPath[i];               // eg:/water/
                pathOnly += "/";
            }
            var fullPath = (pathOnly + 'index.shtml');  // Add index.shtml the path 

/* Fix for the Design Rainfalls bug*/
            if (splitPath[2] == 'designRainfalls'){     
            var pathOnly = "";
                for (var i=0; i < 3; i++){
                    pathOnly += splitPath[i];
                    pathOnly += "/";
                }
            var fullPath = (pathOnly + 'index.shtml');  // Make the path /water/designRainfalls/index.shtml
            }
            if (fullPath != pathFileName){
/* Highlights the currently selected first level tab */
                $(mainSelector + ' a[@href^="' + pathOnly + '"]').parents('li').children('a').addClass('current');
/* Shows the second level nav */
                $(mainSelector + ' a[@href^="' + fullPath + '"]').parents('li').addClass('current');
            }
        }
/* Highlights the currently selected first level tab */
        $(mainSelector + ' a[@href="' + pathFileName + '"]').parents('li').children('a').addClass('current');
/* Shows the second level nav */
        $(mainSelector + ' a[@href="' + pathFileName + '"]').parents('li').addClass('current');
        $('.current > ul').addClass('selected');

/* Bold selected second level item */
        $('li > ul > li.current').css({fontWeight:"bold", background:"url(/water/images/l2-arrow.gif) center bottom no-repeat"});
/* Bold selected third level item */
        $('#tocBody a[@href$="' + pathFileName + '"]').parents('li').addClass('tocSelected');
    }
$('.nav-ul.selected').addClass('test');
});

Answer 1

有些事情：

var navLi = $("#nav > li");
navLi.hover(
    function(e) {
        navLi.children("ul").removeClass("selected");
        $(e.currentTarget).children("ul").addClass("selected");
    }
);

jQuery - 在以下情况下从元素中删除类：hover

1 个答案: