jquery - 单击jquery更改文本

Question

我有以下代码：

<td class="select-cli-numbers"><div class="explanationText" style="cursor:pointer;">Click here to select numbers</div></td>

切换时，我想显示为 Click here to hide CLI numbers

我的js如下，但不起作用。有任何想法吗？

$(".select-cli-numbers").toggle(function () {
            $('#cli-numbers').show();
            $(this).text() = "Click here to hide CLI numbers"
    }, function () {
            $('#cli-numbers').hide();
            $(this).text() = "Click here to show CLI numbers"
        });

Answer 1

你的语法有一点小问题。

$(".select-cli-numbers").toggle(function () {
  $('#cli-numbers').show();
  $(this).children().text("Click here to hide CLI numbers");
}, function () {
  $('#cli-numbers').hide();
  $(this).children().text("Click here to show CLI numbers");
});

text()接受一个文本字符串并将元素的文本节点设置为该字符串。

Answer 2

应该是这样的

$(document).ready(function() {
    $(".explanationText").toggle(function () {
      $('#cli-numbers').show();
      $(this).text("Click here to hide CLI numbers");
    }, function () {
      $('#cli-numbers').hide();
      $(this).text("Click here to show CLI numbers");
    });


});

Answer 3

由于toggle()您正在使用的功能已弃用，我会改为使用点击功能：

$(".select-cli-numbers").on('click', function() {
    var msg = $('#cli-numbers').toggle().is(':visible')?'hide':'show';
    $('.explanationText', this).text("Click here to "+msg+" CLI numbers");
});​

小提琴