There is such a script:

$(function(){ $('.faqParagraph').hide(); $('.faqAnchor').bind('click', function() { var faq = $(this).parent('.child'); $(faq).children('.faqParagraph').slideToggle(200); $(faq).toggleClass('faqActive'); return false; }); }); <div class="faqAnchor"><a href="#">Подробнее...</a></div>

Can the faqAnchor block, when opening the faqParagraph block, replace the text "More ..." with "Close"?

  • Yes, I give you good! - iKuzko 1:51
  • To start, I would cut the source code like this: $ (function () {$ ('. FaqParagraph'). Hide (); $ ('. FaqAnchor'). Click (function () {$ (this) .parent (' .child '). children ('. faqParagraph '). slideToggle (200) .toggleClass (' faqActive '); return false;});}); - Crasher

2 answers 2

You can change the contents of the tag "A" at the time of opening:

 $('.faqAnchor a').html('Закрыть')

and back when you close

 $('.faqAnchor a').html('Подробнее...')

And also pay attention to your code.

 var faq = $(this).parent('.child'); $(faq).children('.faqParagraph').slideToggle(200); $(faq).toggleClass('faqActive');

you are in the faq variable and you get a query object, why wrap it additionally in $ ()? You can simply register

 faq.toggleClass('faqActive').children('.faqParagraph').slideToggle(200);

UPD : You have an on and off class $ (faq) .toggleClass ('faqActive'); Change the text depending on it

 $(faq).toggleClass('faqActive'); $(faq).children('a').html($(faq).hasClass('faqActive')?'Закрыть':'Подробнее...');
  • And you can learn more about close open .. I do not know how to implement it) And with the second one. I'm just that new. Is there any difference - in brackets or without? Just in brackets visually more convenient - inferusvv
  • By the way, yes, this option is more modern)))) - thunder
 $(faq).children('a').html("Закрыть")

like that

ps;

 if (isOpen) { isOpen = false; $(faq).children('a').html("Подробнее"); } else { isOpen = true; $(faq).children('a').html("Закрыть"); }
  • and back back at closing? - inferusvv
  • Well, you can use some kind of flag like isOpen and change its type if (isOpen) {isOpen = false; $ (faq) .children ('a'). html ("Details"); } else {isOpen = true; $ (faq) .children ('a'). html ("Close"); } - thunder