更新列表項的類 - jQuery

非常簡單的問題，但它已經困擾我近一個小時了。基本上，我想更新onClick的列表類，然後在另一個項目被點擊時再次移除類。更新列表項的類 - jQuery

<nav> 
    <div class="menu-main-menu-container"> 
    <ul id="menu-main-menu" class="menu"> 
     <li class="current-menu-item"> 
     <a class="scroll" href="#top"><span>Home</span></a> 
     </li> 
     <li class=""> 
     <a class="scroll" href="#featured_work_anchor"><span>Featured Work</span></a> 
     </li> 
     <li class=""> 
     <a class="scroll" href="#about_contact_anchor"><span>About/Contact</span></a> 
     </li>    
    </ul> 
    </div> 
</nav>

jQuery的

$(document).ready(function() { 
    $('#menu-main-menu li').on('click', changeClass); 
}); 

function changeClass() { 
    $('#menu-main-menu li').removeClass('current-menu-item'); 
    $(this).addClass('current-menu-item'); 
}

JSFiddle，蓄勢待發。我感謝任何幫助。也許我正在接近這個問題，或者錯過了一些愚蠢的東西？

來源

2014-09-03 user1051467

http://jsfiddle.net/arunpjohny/mw5sgcLn/3/ – 2014-09-03 03:39:25

我可以看到的唯一問題是removeClass()函數，要麼不傳遞任何參數，以便刪除li中的所有類，要麼傳遞要刪除的類名。

function changeClass() { 
    $('#menu-main-menu li').removeClass('current-menu-item'); 
    $(this).addClass('current-menu-item'); 
}

演示：Fiddle（另外，在撥弄你忘了，包括jQuery的）

來源

2014-09-03 03:40:03

+1好的答案，儘管編寫'changeClass（）'函數是多餘的。你可以直接將它放入點擊事件中 - 除非提問者打算在點擊'li'的人之外調用該函數。 – Chad 2014-09-03 03:44:50

在OP小提琴中有removeClass（''）這是關鍵問題應該只是removeClass（）; – 2014-09-03 03:46:09

你需要傳遞一個被設置爲當前元素：

$(document).ready(function() { 
    $('#menu-main-menu li').on('click', function(){ 
    changeClass($(this)); 
    }); 
}); 

function changeClass(element) { 
    $('#menu-main-menu li').removeClass('current-menu-item'); 
    element.addClass('current-menu-item'); 
}

更新小提琴：http://jsfiddle.net/mw5sgcLn/4/

來源

2014-09-03 03:43:42 tcmurphy

更新列表項的類 - jQuery

回答

相關問題