我在 jQuery 中切换图标时遇到一些问题。
每个切换部分的 html 是:
<h2 class="collapse"><span class="ui-icon ui-icon-triangle-1-e"></span>Section 1.1</h2>
<p>Hidden text.</p>
和 JavaScript:
jQuery(document).ready(function () {
$(".collapse").click(function () {
$(this).next().toggle();
$("span").toggleClass("ui-icon-triangle-1-s");
}).next().hide();
});
JSfiddle 也 here .
当我单击任何可折叠部分时,所有图标都会立即更改,但并非所有图标都展开/折叠。
我也无法让我的图标与文本位于同一行,尽管这是一个较小的问题。
最佳答案
给你:http://jsfiddle.net/gy653bpL/15/ 。
添加一些CSS:
.collapse span {display:inline-block;}
仅切换事件范围:
$(this).find("span").toggleClass("ui-icon-triangle-1-s");
关于javascript - 切换多个 jQuery 图标,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27799961/