我該如何更改按鈕文字

Question

我有一個按鈕，用於顯示某些內容。 如何在div打開時更改按鈕中的文本。它必須從「VERMÁS」改變爲「VER MENOS」

<a id="showfoo" class="btn btn-primary hidden-xs">VER MÁS</a> 

<script> 
    $(document).ready(function() { 
    $('#showfoo').click(function() { 
      $('#foo').slideToggle(1000, "swing"); 
    }); 
    }); 
</script> 

謝謝！

Answer 1

你可以這樣說：

$(function() { 
 
    
 
    $('#showfoo').click(function() { 
 
     $('#foo').slideToggle(1000, "swing"); 
 
     $(this).toggleClass('showHide'); 
 
     if($(this).hasClass('showHide')) { 
 
     \t $(this).text('Show'); 
 
     } else { 
 
     \t $(this).text('Hide'); 
 
     } 
 
    }); 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button id="showfoo" class="btn btn-primary hidden-xs showHide">Show</button>

希望這有助於！

Answer 2

您可以使用三元運算符和.text（）來實現此目的。

$(function() { 
 
    
 
    $('#showfoo').click(function() { 
 
     $('#foo').slideToggle(1000, "swing"); 
 
     var txt = $(this).text() == "VER MÁS" ? "VER MENOS" : "VER MÁS"; 
 
     $(this).text(txt); 
 
    }); 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button id="showfoo" class="btn btn-primary hidden-xs">VER MÁS</button>