使用jquery切换所有链接

我在这里多次出现打开/关闭效果：

我需要在页面标题下添加一个名为toggle all的链接，点击后，它将打开/关闭每个赞助级别。我该怎么做

见工作代码：

<h3 class="trigger">Presenting Sponsor</h3>
<div class="toggle_container"> content inside toggle_container is hidden/shown when trigger class is clicked</div>



$(document).ready(function(){
    $(".toggle_container").hide();
    $("h3.trigger").click(function(){
    $(this).toggleClass("active").next().slideToggle("fast");
    return false;
});
});

它考虑了任何当前开放或关闭的赞助

.stoptrue，true用于在快速单击切换多次时防止动画链

您还应该使用event.PreventDefault；而不是返回false；在click事件函数中，您需要修改声明。ClickFunction事件{

$("#toggle_button").click(function() {
    $("h3.trigger").toggleClass("active").next().slideToggle("fast");
});

工作示例：

可能

---

JQuery在进行匹配时支持通配符。因此，您可以执行以下操作：

$("a[name=showAllLink]").click(function() {
   var linkTxt = $("a[name=showAllLink]").html();
   if (linkTxt.indexOf('Show')>=0) {
      linkTxt = linkTxt.replace(/Show/,"Hide");
      $("div[class*=toggle_container]").show();
   }
   else {
      linkTxt = linkTxt.replace(/Hide/,"Show");
      $("div[class*=toggle_container]").hide();
   }
   $("a[name=showAllLink]").html(linkTxt);
});

单击名为showAll的锚时，将显示所有锚文本。锚文本将在show all和Hide all之间交替显示

<a href="javascript:void(0)" name="showAllLink">Show All</a>

---

谢谢Andrew。效果很好。我将href=更改为

var toggle = true;

var toggleAll = function(){
    $("h3.trigger").removeClass("active");

    if(toggle){
        $("h3.trigger").next().slideDown("fast");
    } else {
        $("h3.trigger").next().slideUp("fast");
    }

    toggle = (!toggle);
};

$("a[name=showAllLink]").click(function() {
   var linkTxt = $("a[name=showAllLink]").html();
   if (linkTxt.indexOf('Show')>=0) {
      linkTxt = linkTxt.replace(/Show/,"Hide");
      $("div[class*=toggle_container]").show();
   }
   else {
      linkTxt = linkTxt.replace(/Hide/,"Show");
      $("div[class*=toggle_container]").hide();
   }
   $("a[name=showAllLink]").html(linkTxt);
});

<a href="javascript:void(0)" name="showAllLink">Show All</a>