我希望替换父(ul
)元素的子元素(li.filetabs
)的类名。我所做的似乎很正确,但显然不是因为班级没有被替换。
UPDATED WITH JSFIDDLE 注意Jsfiddle:当你点击一次,一切正常,再次点击相同的导航标签,你会看到下拉消失并重新出现......
var aFileTabs = $('.filetabs');
var curTab = $(this);
// this seems to give correct output
var prevCurTab = $('.cTabActive').parent(); //(i.e. *jQuery(li.filetabs)* )
// the following line is the problem line; Ive tried replacing the children with
// $('ul',prevCurTab)... but that doesnt work either... I must be doing something
// very basic wrong
$(prevCurTab).children().removeClass('cTabActive').addClass('cPrevTabActive');
$('ul', curTab).addClass ('cTabActive');
编辑:道歉,我忘记了HTML,还有更多,所以只有前两个导航按钮html被显示才能获得意义。
<div id="filemenu"> <!-- right tabs menu -->
<ul id="fm_ul">
<li class="filetabs">File
<ul>
<li class="m_items"><a href="#"><span class="aHeading">New</span><span class="shortcutK">Ctrl-U</span></a></li>
<li class="m_items"><a href="#"><span class="aHeading">Open</span><span class="shortcutK">Ctrl-Z</span></a></li>
<li class="m_items"><a href="#"><span class="aHeading">Save</span><span class="shortcutK">Ctrl-T</span></a></li>
<li class="m_items"><a href="#"><span class="aHeading">Exit</span><span class="shortcutK">Ctrl-Q</span></a></li>
</ul></li><li class="filetabs">Edit
<ul>
<li class="m_items"><a href="#"><span class="aHeading">Undo</span><span class="shortcutK">Ctrl-M</span></a></li>
<li class="m_items"><a href="#"><span class="aHeading">Redo</span><span class="shortcutK">Ctrl-S</span></a></li>
<li class="m_items"><a href="#"><span class="aHeading">Zoom In</span><span class="shortcutK">Ctrl-R</span></a></li>
<li class="m_items"><a href="#"><span class="aHeading">Zoom Out</span><span class="shortcutK">Ctrl-Q</span></a></li>
</ul></li>
答案 0 :(得分:0)
我根本不确定这一点,但请尝试:
$('.filetabs').on('click', function() {
var aFileTabs = $('.filetabs'),
curTab = $(this),
prevCurTab = $('.cTabActive').parent();
$('.cTabActive').removeClass('cTabActive').addClass('cPrevTabActive');
$('ul', curTab).removeClass('cPrevTabActive').addClass ('cTabActive');
});
答案 1 :(得分:0)
在这篇单独的帖子中回答。谢谢丹尼尔。