javascript - jQuery hasClass 返回 true 但removeClass 不起作用？

Question

此问题已修复。这是糟糕的编程。我调用了该函数两次。所以它正在删除该类，但是当该函数第二次运行时，它正在读取该类。对于我糟糕的编程感到抱歉，并感谢大家的帮助。我喜欢 stackoverflow，因为这里有很多乐于助人的人!

好吧，所以我一直在试图弄清楚一些事情，但可能只是我的感冒阻止了我解决它。我正在做的是，当用户选择某些内容时，它会添加一个类。但如果他们再次选择它，我想删除该类(class)。所以我检查了元素 hasClass 是否返回 true，但是当我执行 removeClass 时它什么也没做...

将 JS 修改为如下所示。为了表明我可以看到 Selectedindex 和索引确实匹配，并且“option-select”的removeClass 由于某种原因被跳过/忽略。我可以将其更改为removeClass(“option”)，它工作得很好，但我不能removeClass(“option-selected”)

$(obj.find('.option')).each(function(Selectedindex) {
    if ($(this).hasClass('option-selected') && Selectedindex == index) {
        $(this).removeClass('option-selected');
        console.log(Selectedindex+" == "+index);
    }
});

选择元素时，索引会传递给函数。

这里是一些 HTML

<div id="MultipleSelect-HTML" class="dropdown container" multiple="multiple" style="width: 100%;">
    <ul class="options" style="width: 100%; display: block; position: relative;">
        <li>
            <a class="option option-selected"> 
                <input class="option-value" type="hidden" value="0"> 
                <img class="option-image" src="http://cdn1.iconfinder.com/data/icons/inside/PNG/032x032/icontexto-inside-facebook.png"> 
                <label class="option-text" style="cursor:pointer;">Facebook</label> 
                <small class="option-description desc">Check out my Facebook page!</small>
            </a>
        </li>
        <li>
            <a class="option option-selected"> 
                <input class="option-value" type="hidden" value="1"> 
                <img class="option-image" src="http://cdn1.iconfinder.com/data/icons/inside/PNG/032x032/icontexto-inside-twitter.png"> 
                <label class="option-text" style="cursor:pointer;">Twitter</label> 
                <small class="option-description desc">Check out my Twitter page!</small>
            </a>
        </li>
        <li>
            <a class="option"> 
                <input class="option-value" type="hidden" value="2"> 
                <img class="option-image" src="http://cdn1.iconfinder.com/data/icons/inside/PNG/032x032/icontexto-inside-linkedin.png"> 
                <label class="option-text" style="cursor:pointer;">LinkedIn</label> 
                <small class="option-description desc">Check out my LinkedIn page!</small>
            </a>
        </li>
        <li>
            <a class="option"> <input class="option-value" type="hidden" value="3"> 
                <img class="option-image" src="http://cdn1.iconfinder.com/data/icons/inside/PNG/032x032/icontexto-inside-flickr.png"> 
                <label class="option-text" style="cursor:pointer;">Flickr</label> 
                <small class="option-description desc">I don't have a flicker Page :(</small>
            </a>
        </li>
    </ul>
</div>

请记住，所有这些信息都是使用 JavaScript 动态生成的

感谢您提供的任何帮助。

Answer 1

您正在为 option-selected 执行 hasClass，但尝试删除Class dd-option-selected

假设是dd-option-selected，如下更改，

$(obj.find('.option')).each(function(Selectedindex) {
    if ($(this).hasClass('dd-option-selected') && Selectedindex == index)
        $(this).removeClass('dd-option-selected');
});

Yeah, fixed that thanks... but it still doesn't work. Any other ideas? – Robert E. McIntosh

If this has dd-option-selected and it is not removing the class then the Selectedindex is not equal to index – Vega