javascript - SlideToggle 容器以及按钮 innerHTML

Question

我编写了一个按钮，单击时可以滑动切换容器:

<a href="#" id="toggleButton">innerHTML</a>
<div id="toggleBody">Body Container</div>

使用jQuery的slideToggle调用函数:

$('#toggleBody').hide();
$('#toggleButton').click(function() {
    $('#toggleBody').slideToggle(200);
});

我需要将按钮 innerHTML 与切换的 toggleBody 容器一起切换为其他内容。有什么帮助吗？

代码片段:http://jsfiddle.net/9kyr76y1/

Answer 1

您可以使用.text()回调函数来获取当前文本并切换新值:

$('#toggleButton').click(function() {
 $(this).text(function(i, text){
      return text === "innerHTML" ? "outerHTML":"innerHTML";
  })
 $('#toggleBody').slideToggle(200);
});

<强> Working Demo