标签: toggleclass

如果这是一个新手问题,请原谅我:

我有一个菜单设置打开下一个div以查看更多细节,如果还有另一个div打开它将关闭它,同时打开新的.如果你单击与该div关联的标题,我无法弄清楚如何关闭已打开的div.它只是关闭并重新打开.

码:

$(document).ready(function() {

    $(".heading").click(function(){
        if($(".content").is(":visible")){
            $(".less").removeClass("less");
            $(".content").slideUp(500);
        }
        $(this).next(".content").slideToggle(500);
        $(this).children(".more").toggleClass("less");
    });

});

任何帮助表示赞赏.

我的单选按钮周围有一个标签,背景应该改变:悬停和:焦点

<label for="radio1" class="radio-blur">
<input name="job" id="radio1" value="1" type="radio"> Graphic Design</label>

我想将类从.radio-blur更改为.radio-focus

我有

    $(document).ready(function(){
        $('input:radio').click(function() {
            $(this).parent('label').toggleClass('.radio-focus');
        });  
    }); 

但它不起作用......请帮忙

我想通过点击它来切换一个DIV类,但不是在点击DIV内的链接时切换.

我尝试了这个,但即使单击链接,它也会切换到类:

$("ol.compacted .tl_general:not(a)").click(function () {
    $(this).toggleClass("re-expanded");
});

我能做什么？提前致谢!

我有一个问题,toggleClass它似乎无法正常工作.图像应该在show和之间变化hide.它确实改变了hide,但没有回来

这是我的例子和一些代码:

<div class="top_menu_hidden" style="display: none; ">testing</div>
<div class="show_menu"></div>

$('.show_menu').on('click', function(){
        $('.top_menu_hidden').stop().slideToggle('normal', function(){
            $(".show_menu").toggleClass("hide_menu show_menu");
        });
});?

.show_menu{
    background: url("http://placehold.it/150&text=show") no-repeat scroll 0 0 transparent;
    height: 150px;
    width: 150px;
}
.hide_menu{
    background: url("http://placehold.it/150&text=hide") no-repeat scroll 0 0 transparent;
    height: 150px;
    width: 150px;
}

有任何想法吗？

谢谢

目前我有一个手风琴菜单,每次.responsive-accordion-head点击我告诉它切换类如下:

$('.responsive-accordion-head').click(function () {

    if ( $( '.responsive-accordion-head i' ).hasClass( "plus-2" ) ) {

        $('.responsive-accordion-head i').removeClass("plus-2");
        $('.responsive-accordion-head i').addClass("minus-2");

    } else {
        $('.responsive-accordion-head i').removeClass("minus-2");
        $('.responsive-accordion-head i').addClass("plus-2");
    }

});

我遇到的问题是上面的代码更改了所有.responsive-accordion-head元素的类.我需要它仅针对所点击的项目.我该怎么做呢？

我有一个按钮可以打开和关闭DIV层.我正在尝试向按钮添加一个类,以便当它在其上切换时显示不同,但是我无法使其工作,在切换按钮时不会添加该类.

该按钮是列表项,例如开/关

这是我的代码:

$("#btninformation").click(function () {
  $("#map-items-category-one").toggle("slow", function() {
    $(this).toggleClass("toggled-on");
  });
});

任何想法都有错吗？

谢谢扎克

我是jQuery的新手,我正在尝试编写一个简单的脚本,当单击"显示更多"链接时将显示更多文本.

目前我能够更改"显示更多"和"显示更少"之间的链接文本,但我仍然无法切换两个css类.第一个类隐藏选择的内容,第二个类应该显示它.

这是迄今为止的代码:

CSS

.hideThis{
display:none;
}
.showThis{
display:inline;
}

HTML

<div class="review">
                                <p >Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus pellentesque 
                                sagittis velit, varius commodo odio accumsan ut. Etiam vestibulum commodo viverra. 
                                Integer condimentum quis ligula eget interdum. Vivamus semper posuere sapien ut tristique
                                <span class="hideThis">Etiam vestibulum commodo viverra. 
                                Integer condimentum quis ligula eget interdum. Vivamus semper posuere sapien</span>
                                <a href="#" class="showMoreText">... show more</a>
                                </p>
                            </div>

jQuery的

$('.showMoreText').click(function(){

        var text = $(this).html();
        if(text == '... show more'){ …

我有以下html:

<div class="profileRowHeader">
    <i class="glyphicon glyphicon-folder-close" id="folderIcon"></i>
</div>

当.profileRowHeader被点击我要删除类glyphicon-folder-close,并添加类glyphicon-folder-open到#folderIcon

这就是我正在尝试的:

$('.profileRowHeader').click(function() {
    $(this).find("#folderIcon").toggleClass('glyphicon-folder-open','glyphicon-folder-close');
});

但它所做的只是添加glyphicon-folder-open类而不是删除glyphicon-folder-close类,如下所示:

<i class="glyphicon glyphicon-folder-close glyphicon-folder-open" id="folderIcon"></i>

这是预期的行为吗？如果可能的话我真的需要删除它

我希望在点击链接后切换链接内部的图标类.我现在正在工作,但点击后我的所有图标都改变了 - 我在页面上有多个手风琴.我只想更改点击链接的图标.有人可以帮忙吗？我知道它必须与'this'有关,但我无法理解.

jQuery代码

$( ".accordion a" ).click(function() {
    $( ".accordion a i" ).toggleClass('fa-caret-up ','fa-caret-down');
});

HTML代码

<a href="#panel{accordion_number}">{accordion_heading} <i class="fa fa-caret-down linkIcon"></i></a>

This functions starts when I click on a link. It needs to remove all '.is-active' classes on the elements with the attribute [data-route]. And add the class '.is-active' on the [data-route] element that is connected with the link I clicked on.

    toggle: function(section){
        var sections = document.querySelectorAll('[data-route]');
        for (i = 0; i < sections.length; i++){
            document.querySelector('[data-route]').classList.remove('is-active');
        }
        document.querySelector(section).classList.add('is-active');
    }

But this doesn't work. It doesn't remove the classes?

See example: http://jordypouw.github.io/myFED2/deeltoets1/index.html

P.S. it has to be in vanilla JavaScript.