如果不是,则无法使用Jquery更改跨度内的文本

时间:2015-01-30 17:13:15

标签: javascript jquery

我试图在点击span时根据其当前值更改$('.details_btn').click(function(){ if($(this).text('Open'){ $(this).html('Close'); }else{ $(this).html('Open'); } }); 的文本。

如果是打开 - 则将值设置为关闭。

如果是关闭 - 则将值设置为打开。

{{1}}

我有一个小提琴我在这里做的事情:

http://jsfiddle.net/javacadabra/ch0u1xws/

然而,似乎从关闭到开放似乎没有回来,我不知道为什么。有人可以对此有所了解吗?

非常感谢

4 个答案:

答案 0 :(得分:2)

您的if声明有点不对劲。 .text()接受一个参数来设置文本,只需将其命名为无参数即可返回当前文本。所以:

if($(this).text('Open')){

应该是:

if($(this).text() == 'Open'){

答案 1 :(得分:1)

text()函数检索或设置元素的内部文本。因此,要测试它的当前值,您应该使用:

if($(this).text() == "Open")

而不是

if($(this).text('Open'))

更新你的小提琴:http://jsfiddle.net/ch0u1xws/2/

答案 2 :(得分:1)



$(document).ready(function(){
    $('.details_btn').click(function(){
        if($(this).text() == 'Open'){
            $(this).html('Close');
        }else{
            $(this).html('Open');   
        }
    });
});




答案 3 :(得分:1)

要获取当前值,请不要像其他人提到的那样为.text()函数提供任何参数。但另一种解决方案是传递一个函数来操作当前值,如下所示:

$(document).ready(function(){
  $('.details_btn').click(function() {
    $(this).text(function(i, text) {
      return text == 'Open' ? 'Close' : 'Open';
    });
  });
});

$(document).ready(function(){
  $('.details_btn').click(function() {
    $(this).text(function(i, text) {
      return text == 'Open' ? 'Close' : 'Open';
    });
  });
});
.details_btn{
    background-color: red;
    color:white;
    padding:20px;
    text-transform:uppercase;
    font-family:calibri;
    font-weight:bold;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<span class="details_btn">Open</span>