向下滑動功能很好，但我需要在單擊按鈕時將按鈕中的文本和字體真棒圖示從“打開所有問題（向下圖示）”更改為“關閉所有問題（向上圖示）”，然后恢復為關閉時“打開所有問題”。謝謝！[
$(document).ready(function(){
$("#showNavBut").click(function() {
$("#showNav").slideToggle();
if ( $('#showNav').css('display').display == 'block' ) {
$('#showNavBut').html('Close all questions <i aria-hidden="true"></i>'); // Change button text
}
else {
$('#showNavBut').html('Open all questions <i aria-hidden="true"></i>'); // Change button text
}
});
});#showNav {display: none;}<link href="https://pro.fontawesome.com/releases/v5.10.0/css/all.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<div id="showNav">
<div class="#">
<a href="#">Confidence Household 1</a>
<a href="#">Confidence Household 2</a>
<a href="#">Confidence Household 3</a>
<a href="#">Confidence-Household 3</a>
</div>
</div>
<button id="showNavBut" class="show-nav-but" style="width: auto;">Open all questions <i class="fas fa-chevron-down" aria-hidden="true"></i></button>
</div>] 1
uj5u.com熱心網友回復：
看起來問題是你沒有等待showNav采取 block/none 狀態，在按下按鈕的那一刻它有一個狀態，但是執行slideToggle需要一些時間，你可以使用回呼函式并在執行slideToggle后更改按鈕的狀態
$(document).ready(function () {
$("#showNavBut").click(function (event) {
$("#showNav").slideToggle(500, function () {
if ($('#showNav').is(':visible')) {
$(event.currentTarget).html('Close all questions <i aria-hidden="true"></i>');
} else {
$(event.currentTarget).html('Open all questions <i aria-hidden="true"></i>');
}
});
});
});#showNav {
display: none;
}<link href="https://pro.fontawesome.com/releases/v5.10.0/css/all.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<div id="showNav">
<div class="#">
<a href="#">Confidence Household 1</a>
<a href="#">Confidence Household 2</a>
<a href="#">Confidence Household 3</a>
<a href="#">Confidence-Household 3</a>
</div>
</div>
<button id="showNavBut" class="show-nav-but" style="width: auto;">Open all questions <i class="fas fa-chevron-down" aria-hidden="true"></i></button>轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/371621.html
上一篇：插入帶有點擊標簽文本的節點
下一篇：獲取陣列中的查詢字串值