Question

我在div和span标签内部有一个小问题。它的作用是成为打开下拉div的href，当再次点击文本时它会关闭该div。

<a href="#" id="toggle4">
    <span class="halfCircleBottom">OPEN</span>
</a>

所以我想要实现的是，当我点击OPEN时，它应该变为CLOSE，当我点击CLOSE时它应该改为OPEN。到目前为止，我发现的所有内容都是一次更改文本，但不会再次返回原始值。

Answer 1

$('span.halfCircleBottom').click(function(){
    this.innerHTML = this.innerHTML === "OPEN" ? "CLOSE" : "OPEN";
});

Live DEMO

Answer 2

$(document).ready( function(){
    $("#cf_onclick").toggle(
        function(){$(this).html("<h2>A</h2>");},
        function(){$(this).html("<h2>B</h2>");}
    ).click();
});

另一种方法

$('#toggle_template').html(function(i, html) {
        if (html.indexOf(' (click to view)') > 1) {
            return html.replace(' (click to view)', ' (click to close)')
        }
        return html.replace(' (click to close)', ' (click to view)')
    });

JSFIDDLE DEMO

第二种方法JSFIDDLE DEMO

Answer 3

使用JQuery很容易:)

<a href="javascript:void(0);" onclick="btnclick()"><span class="halfCircleBottom">OPEN</span></a>

JS：

function btnclick() {
 $('#divID').slideToggle();
  if ($('.halfCircleBottom').text() == "CLOSE"){
  $('.halfCircleBottom').text("OPEN")
  } else {
  $('.halfCircleBottom').text("CLOSE")
  }
}

单击时，它会将文本更改为OPEN或关闭，并同时向上和向下滑动div。这很容易理解：）

在div中更改文本

3 个答案: