Question

我正在使用jQuery 1.3.2（由于drupal6无法更新）

的jQuery

$(document).ready(function() {
  var textcontent = $('.trig').text();

  $('.trig').click(function() {
    if (textcontent == 'Open') {
      $(this).text('Close').addClass('not-trig');
    } else if (textcontent == 'Close') {
      $(this).text('Open');
    }
  })
});

HTML

<div class="trig">Open</div>

我正在尝试做什么：

当您点击带有.trig类的div时，它应该将文本“OPEN”更改为“close”，反之亦然。但似乎点击工作只有一次，当我第一次点击它将文本从“打开”更改为“关闭”，但当我再次点击 - 没有任何反应...

Answer 1

您需要在每次点击中重新获取var textcontent = $('.trig').text();的值

$(document).ready(function() {
    $('.trig').click(function() {
        var textcontent = $('.trig').text();
        if (textcontent == 'Open') {
            $(this).text('Close').addClass('not-trig');
        } else if (textcontent == 'Close') {
            $(this).text('Open');
        }
    })
});

演示：Fiddle

另一个干净的实现可能是查找类not-trig，因为看起来只有在close时才需要该类。即如果文本为Open，则可能必须删除not-trig

$(document).ready(function() {
    $('.trig').click(function() {
        var $this = $(this);

        if($this.hasClass('not-trig')){
            $this.text('Open').removeClass('not-trig');
        } else {
            $this.text('Close').addClass('not-trig');
        }
    })
});

演示：Fiddle

如何使用点击功能作为切换

1 个答案: