javascript - 如何在点击功能中使用 jQuery 改回 innerhtml？

Question

我有以下功能：

$('#jaTack').click(function() {
        $('#syskon').slideToggle();
        $('#jaTack').html('Hide');
    });

按钮的 id 也是如此#jaTack，按下时会显示 id 的内容#syskon。按下按钮时，我将该按钮的内部 html.html()从“显示”更改为“隐藏”。这一切都很好，但我不确定再次按下它时我应该怎么做，以便按钮的 innerhtml 再次变为“显示”？

希望有人有时间帮助我。

Answer 1

您需要将状态存储在某个地方，为什么不使用匿名函数呢？

$('#jaTack').click((function() {
    var toggle = false;
    return function () {
        if (toggle) {
            $('#jaTack').html('Show');
        } else {
            $('#jaTack').html('Hide');
        }
        $('#syskon').slideToggle();
        toggle = !toggle;       
    };
}());   // immediate invocation because we're awesome

Answer 2

您可以像这样使用三元运算符 ?:

$('#jaTack').click(function() {
    $('#syskon').slideToggle();
    $('#jaTack').html($('#jaTack').html() == "Show" ? "Hide" : "Show");
});