jQuery slideToggle 函数答案

【问题标题】：jQuery slideToggle functionjQuery slideToggle 函数
【发布时间】：2012-10-28 18:06:01
【问题描述】：

我正在尝试使用 slideToggle 显示/隐藏一个 div，但同时更改另一个 div 的内容。

到目前为止我有：

        $('#show-advanced').click(function(){
            $("#advanced").slideToggle("fast","linear",function() {
              $('#show-advanced').html('Advanced Options &#9652;');
            }, function() {
              $('#show-advanced').html('Advanced Options &#9662;');
            });
        });

它改变了第一次点击的内容，但在第二次切换时它不会改变它。

任何帮助将不胜感激。

编辑：

固定使用：

            $("#show-advanced").toggle(function() {
                $('#advanced').slideDown("fast");  
                $('#show-advanced').html('Advanced Options &#9652;');
            }, function() {
                $('#advanced').slideUp("fast"); 
                $('#show-advanced').html('Advanced Options &#9662;');
            });

【问题讨论】：

两个回调中的 HTML 内容是相同的......你到底想“改回”什么？（编辑： 已更正）。更相关：.slideToggle 不接受两个回调：api.jquery.com/slideToggle。
糟糕，原来如此（但仅在此处，不在我的代码中），但是仍然无法正常工作。
因为.slideToggle 不像你想象的那样工作。查看文档。
无论如何，将其更改为 .toggle 也不起作用。即使这绝对允许两个回调。
.toggle 仅将多个事件处理程序绑定到一个元素，并在您单击该元素时在它们之间交替。它不能替代.slideToggle。

标签： jquery slidetoggle

【解决方案1】：

在我看来，您需要 .toggle 和 .slideToggle 的组合：

$('#show-advanced').toggle(function() {
    $("#advanced").slideToggle("fast","linear",function() {
        $('#show-advanced').html('Advanced Options &#9652;');
    });
), function() {
    $("#advanced").slideToggle("fast","linear",function() {
        $('#show-advanced').html('Advanced Options &#9662;');
    });
});

.toggle 将这两个函数绑定到 #show-advanced 并在每次点击时在它们之间交替。

【讨论】：