在切换jQuery上更改按钮文本

Question

一个简单的问题，为什么该代码只更改按钮中的文本以隐藏详细信息，而从不更改为显示详细信息？

$CandidateList.on('click', '.detail-button', function () {
    toggleDetails($(this));
});

//toggle details
function toggleDetails($btn) {
    $btn.next('table').toggle(480);
    if ($btn.text('Show details')) {
        $btn.text('Hide details')
    }
    else
        $btn.text('Show details')
}

Answer 1

您需要获取文本，而不是像现在一样设置：

$CandidateList.on('click', '.detail-button', function () {
    toggleDetails($(this));
});

//toggle details
function toggleDetails($btn) {
    $btn.next('table').toggle(480);
    $btn.text() == "Show details" ? $btn.text("Hide details") : $btn.text("Show details");
}

Answer 2

您在条件中的切换是设置文本，而不是获取其真实值。

function toggleDetails($btn) {
    $btn.next('table').toggle(480);
    $btn.text($btn.text() == 'Show details' ? 'Hide details' : 'Show details')
}