jquery - 使用 JQ 切换链接文本的问题

Question

我尝试使用此代码来切换链接上的文本：

var showText="<span>Open</span> &darr;";
var hideText="<span>Close</span> &uarr;";
$('h1').before('<a href="javascript:;" id="hc_toggle_close">' + showText + '</a>');
$('#hc_toggle_close').click(function () {
    $('#hc_toggle_close:contains("Open")').html(hideText);
    $('#hc_toggle_close:contains("Close")').html(showText);
});

但它不起作用！以及通常的 if ... else 构造。有人可以指出我这里出了什么问题。谢谢！

Answer 1

使用toggle辅助函数：

var showText="<span>Open</span> &darr;";
var hideText="<span>Close</span> &uarr;";
$('h1').before('<a href="javascript:;" id="hc_toggle_close">' + showText + '</a>');
$('#hc_toggle_close').toggle(
  function () {
    $('#hc_toggle_close').html(hideText);
  },
  function () {
    $('#hc_toggle_close').html(showText);
  }
);

从以下文档toggle：

每当单击匹配的元素时，都会触发第一个指定的函数，再次单击时，会触发第二个指定的函数。所有后续的点击继续通过这两个功能旋转。