Bootstrap Dropdown切换图标问题

2015-10-15 99 views 0 likes

我正在使用Twitter Bootstraps WordPress上的“下拉菜单”是我创建的一些小工具，它工作正常。但是我想在图标变为“减号”时将图标更改为“减号”，而当点击另一个“加号”图标时，“减号”应该关闭。目前它只会切换当前的“加号”。Bootstrap Dropdown切换图标问题

<div class="dropdown toggle-details"> 
    <img src=""> 
    <h3>title</h3> 
    <h4><subtitle</h4> 
    <a class="dropdown-toggle my-btn" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"><i class="fa fa-plus-circle"></i></a> 
     <ul class="dropdown-menu" > 
     <li> <h6>item 1</h6></li> 
     <li><h6>item 2</h6></li> 
    </ul> 
</div>

我的剧本是

jQuery('a').click(function() { 
jQuery(this).find('i').toggleClass('fa-minus-circle'); 
jQuery(this).find('fa-minus-circle').toggleClass('fa-plus-circle')});

来源

2015-10-15 melonye

回答

你错过了在jQuery的一个点，所以现在的jQuery是“一个”内寻找与标签名称FA-负圈的HTML元素元件。显然没有找到它。

jQuery(this).find('.fa-minus-circle').toggleClass('fa-plus-circle')...

实际上，可能不会修复，要么，因为这句话后，你会与我元素两个类告终。我想你可以用css解决这个问题，但更简洁的方法是将“我”元素默认为+图标，然后切换更多的语义类名称，如“打开”。

所以CSS：

i { /* show plus icon */ } 
i.open { /* show minus icon */ }

和jQuery：

jQuery("a").on("click", function() { 
    jQuery(this).find("i").toggleClass("open"); 
});

嘿 - 现在，我刚才输入所有的东西我看你与第二条语句在做什么。所以是的，你只需要一个点，所以jquery寻找类名而不是元素。

来源

2015-10-15 23:28:41

Bootstrap Dropdown切换图标问题

回答

相关问题