代码之家 › 专栏 › 技术社区 › thesowismine

从下拉列表中选择选项时,JS未按预期工作

jquery-events jquery javascript

thesowismine · 技术社区 · 10 年前

球门

单击的成员 <ul> 选择/取消选择它。
如果选择了class=allSearch,则取消选择已选择的任何其他li。
如果选择了allSearch,但未选择allSearch则取消选择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>

简体中文:

$(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');
});
})

1 回复 | 直到 4 年前

kanudo 10 年前

试试这个:不要在CLASS上使用ID

$(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');
    });
});

这是 pen to test

推荐文章

Saubhik Mandal · Javascript自定义事件从返回false的函数激发

9 年前

JLR · 当输入字段有值时,从“提交”按钮中动态删除禁用的值

9 年前

Marco · 在ajaxStop之前执行的表单提交处理程序

9 年前

Giox · 使用appendTo()时,单击事件不绑定到动态元素

9 年前

Nicolas Frbezar · Javascript事件侦听器问题

10 年前

Katrina · 对未定义事件使用off()时,jQuery会抛出错误吗?

10 年前

thesowismine · 从下拉列表中选择选项时,JS未按预期工作

10 年前

Micaiah Wallace · 未触发更改时的jQuery文件输入

10 年前

radbyx Matt · 数据表。如何停止搜索。dt事件从事件处理程序内部触发

10 年前

Jos · JQuery移动页面containertransition事件未按预期工作

11 年前