Question

我正在开发一个有两种模式的菜单，当用户点击其中一个列表项的类更改时，我可以让它在第一次模式更改时工作但是当我尝试更改它时它确实不行。

这是我的代码

$('#menu ul.mode li.edit').click(function() {
    $('#menu').css('background-image', 'url(images/edit-menu/fundo.png)');
    });
    $('#menu ul.icons li.ummix').removeClass('ummix').addClass('um');


$('#menu ul.mode li.mix').click(function() {
    $('#menu').css('background-image', 'url(images/edit-menu/fundo-mix.gif)');
    $('li.um').removeClass('um').addClass('ummix');

});

不起作用的部分是

$('#menu ul.icons li.ummix').removeClass('ummix').addClass('um');

我的HTML就像这样

<div id="menu">
<ul class="mode">
    <li class="edit"><a href="#edit"><img src="images/edit-menu/selected/edit.gif" /></a></li>
    <li class="mix"><a href="#mix"><img src="images/edit-menu/icons/mix.png" /></a></li>
</ul>

<ul class="icons"> 
    <li class="um"></li>
</ul>

Answer 1

添加和删除相反的类变得难以处理。

假设 unmix和um彼此相反，我建议您只使用一个班级。然后检查它的存在或不存在。那时你可以简单地使用像toggleClass()这样的东西。

Answer 2

删除ummix类后，选择器不再适用于这些元素。在删除um之前，请尝试添加ummix类。

remove和addClass只能工作一次

2 个答案: