如何在手风琴的h3标题上切换文本

Question

我的h3标题用作jquery驱动的手风琴的触发器。我希望能够在单击标题时附加单词“（click me）”，将该短语切换为开启和关闭。 （单击时删除单词，“关闭”时附加单词）。编写的代码非常有用......除了它将第一个h3的文本放在所有头文件中。 （“Header One”和“Header Two”成为“Header One（点击我）”和“Header One（点击我）。”我猜我需要一些版本的“foreach” - 但它让我感到难过。

我的灵感来自于in this example中找到的信息 - 但它与我的改编中发现自己陷入了不同之处。

(function($) {
$(document).ready(function(){

$(".ui-accordion-header").not('.ui-state-active').append(' (click me)');

$(".ui-accordion-header").click(function () {

var originaltext = $(this).text();             
var replacetext = " (click me)";      
var newtext = originaltext.replace(replacetext,'');

$(".ui-accordion-header").text(newtext);

$(".ui-accordion-header").append(' (click me)');

$(".ui-accordion-header.ui-state-active:contains('lick')").text(newtext);
});

});

})(jQuery);

Answer 1

如果我理解正确，我认为您的问题是您将所点击的标题的文本放入所有标题中。试试this：

(function($) {
    $(document).ready(function(){

        $(".ui-accordion-header").not('.ui-state-active').append(' (click me)');

        $(".ui-accordion-header").click(function () {

            $(".ui-accordion-header").each(function(){

                var originaltext = $(this).text();             
                var replacetext = " (click me)";      
                var newtext = originaltext.replace(replacetext,'');
                $(this).text(newtext);
            });

            $(".ui-accordion-header").not('.ui-state-active').append(' (click me)');
        });    
    });    
})(jQuery);