[英]JS not working as expected when selecting options from dropdown
目标
单击<ul>
的成员以选择/取消选择它。
如果选择class = allSearch,则取消选择任何其他已选择的li。
如果选择了allSearch,然后选择了notAllSearch,则取消选择allSearch。
问题
目标3无法正常工作,对我来说这没有意义,因为它应该(并且基本上)与目标2中使用的代码相同。
这是代码:
的HTML
<ul class="menu vertical" id="searchMenu">
<li id="allSearch" class="allSearch selected">All</li>
<li id="notAllSearch" class="notAllSearch">User</li>
<li id="notAllSearch" class="notAllSearch">Artists</li>
<li id="notAllSearch" class="notAllSearch">Events</li>
</ul>
JS:
$(document).ready(function() {
$('#searchMenu li').click(function () {
if ($(this).hasClass('selected')) {
$(this).removeClass('selected');
}
else if ($(this).hasClass('notAllSearch')) {
$('#allSearch').removeClass('selected')
$(this).addClass('selected');
}
else if ($(this).hasClass('allSearch')) {
$('#notAllSearch').removeClass('selected')
$(this).addClass('selected');
}
else
$(this).addClass('selected');
});
})
试试这个:代替ID在CLASS上工作
$(document).ready(function() {
$('#searchMenu li').click(function () {
if ($(this).hasClass('selected')) {
$(this).removeClass('selected');
}
else if ($(this).hasClass('notAllSearch')) {
$('.allSearch').removeClass('selected')
$(this).addClass('selected');
}
else if ($(this).hasClass('allSearch')) {
$('.notAllSearch').removeClass('selected')
$(this).addClass('selected');
}
else
$(this).addClass('selected');
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.