使用Jquery隐藏显示div（需要反转）

请查看小提琴：

我想在页面加载时隐藏DIV，并使用ascii字符表示链接上的向上和向下箭头，这样一旦单击DIV，就会向下滑动。工作正常，但我想要反向功能，以便在页面加载时隐藏它。已尝试将可见性更改为隐藏，但不起作用lol

比如：

展示▼

及

---

隐藏▲

如果希望它最初不可见，只需将

style=“display:none”

添加到

元素中即可。

如何：

$(document).ready(function () {

    $("#closeable").slideToggle();
    state = "hide";

    $("#setup").click(function() {
        $("#closeable").slideToggle();

        if (state == "hide") {
            $("#setup").text("Show Content");
            state == "show"
        }
        else {
            $("#setup").text("Hide Content");
            state == "hide"
        }

    });
});

$(document).ready(function() {
    $("#setup").click(function() {
        $("#closeable").slideToggle(function() {
            if ($(this).is(":visible")) {
                $("#setup").text("Hide Content");
            }
            else {
                $("#setup").text("Show Content");
            }
        });
    });
});

确保在回调函数中检查内容的可见性（确保内容可见）

---

更新的示例：

好的，我已经测试过了，这就是有效的方法

注意，我们添加了

$（“#closeable”）.hide（）位于ready（）函数的开头，因此隐藏了对象div

其次，我们移动
$（“#closeable”）.slideToggle（）测试后。您遇到的问题是，
slideToggle（）
作为一个线程执行，其余的代码继续执行，因此，
is（':visible'）
语句仍然部分可见或只是变得可见。通过先测试，我们消除了竞争条件

干杯

$(document).ready(function () {

    $("#closeable").hide();

    $("#setup").click(function() {

        if($("#closeable").is(":visible")) {
            $("#setup").text("Show Content ▼");
        }
        else {
            $("#setup").text("Hide Content ▲");
        }

        $("#closeable").slideToggle();
    });
});

我刚刚改进了安德鲁先生的代码：

$(document).ready(function() {
    $("#setup").click(function() {
        $("#closeable").slideToggle(function() {
            if ($(this).is(":visible")) {
                $("#setup").text("Hide Content ▲");
            }
            else {
                $("#setup").text("Show Content ▼");
            }
        });
    });
});

现场演示：
我的问题是如何显示$（“#setup”）.text（“隐藏内容”）；JS中的向上和向下箭头指针，没有实际发布图像，因为它表示字符编码将丢失？向上使用此\u25b2，向下使用此\u25bc，@422:没问题！很乐意帮忙。