删除上次单击跨度上的图标

Question

问题

我试图仅在最后一次单击 span.highlight 时隐藏 Font Awesome "plus" 图标，并在没有 active 的 class 的范围内显示它，但是现在它正在删除两个跨度上的图标，并且在添加活动 class 后不会显示。

JSFiddle：http://jsfiddle.net/dg6w2sk2/

scripts.js

$(".highlight").click(function() {
   $(".highlight").removeClass("active"); // Remove active class from spans
   $(this).addClass("active");  // Add an active class to span just clicked
   $(".fa-plus-circle").hide();  // Remove plus sign on active span
   $(".info").fadeIn(); // Fade in the info box to the left
});

index.html

<p><span class="highlight underline active" title="Read about the 'Clutter Hoarding Scale'"><i class="fa fa-plus-circle"></i> Next level church-key Shoreditch brunch</span> readymade. Chia pickled whatever, Blue Bottle farm-to-table messenger bag Neutra disrupt you probably haven't heard of them keytar dreamcatcher biodiesel banjo cardigan. Actually cliche you probably haven't heard of them put a bird on it tattooed, cray Bushwick irony selfies synth lomo gastropub. <span class="highlight underline"><i class="fa fa-plus-circle"></i>Tousled occupy Schlitz Austin.</span></p>

Answer 1

你可以使用这个：

$(".highlight").click(function() {
       $(".highlight").removeClass("active"); // Remove active class from spans
        $(".fa-plus-circle").show();

       $(".info").fadeIn(); // Fade in the info box to the left

       var active = $(this).hasClass("active");
       /*if (active) {
            $(this).find(".fa-plus-circle").hide();  // Remove plus sign on active span
       } else {
            $(this).find(".fa-plus-circle").show();
       }*/

        $(this).addClass("active");  // Add an active class to span just
        $(this).find(".fa-plus-circle").hide();
    });

此处示例：http://jsfiddle.net/dg6w2sk2/6/

删除上次单击跨度上的图标

Remove icon on last clicked span

javascript

jquery

font-awesome

问题

JSFiddle：http://jsfiddle.net/dg6w2sk2/

scripts.js

index.html