jQuery的 - 切换文本

-2

function switch() 
{ 
    if(document.getElementById('mydivid').innerHTML == "Show +") 
     document.getElementById('mydivid').innerHTML = "Show -"; 
    else 
     if(document.getElementById('mydivid').innerHTML == "Show -") 
      document.getElementById('mydivid').innerHTML = "Show +"; 
}

但我期待与jQuery来做到这一点。我有：

$(document).ready(function() { 
     $("#mydivid").click(function() { 
      // if #mydivid is "Show +" do: $("#mydivid").html("Show -"); 
      // else if #mydiv is "Show -" do: $("#mydivid").html("Show +"); 
     }); 
    });

如何使用这些if s？或者我可以使用只有一个div元素的切换器？

来源

2012-03-06 fj123x

我认为这应该工作。

$(document).ready(function() { 
     $("#mydivid").click(function() { 
      if ($(this).text() === "Show +") 
       $(this).text("Show -"); 
      else 
       $(this).text("Show +"); 
     }); 
    });

来源

2012-03-06 22:37:21 1b0t

您可以使用.text()函数来获取div内容作为文本。尝试下面的代码。

DEMO

$(document).ready(function() { 
    $("#mydivid").click(function() { 
     if ($(this).text() == 'Show +') { 
      $(this).text('Show -'); 
     } else if ($(this).text() == "Show -") { 
      $(this).text('Show +'); 
     } 
    }); 
});

PS：包裹.text内$.trim()如果div有white space/newline。

来源

2012-03-06 22:35:10

你并不真正需要的'其他if';只是一个'else'很好，但是我认为在元素的文本被另一个JS修改的情况下有明确的行为是很好的。如果你的if（）也使用大括号，那么+1。 – Bojangles 2012-03-06 22:37:08

@JamWaffles确实，但OP原始代码有它，所以我添加了其他的，而不是其他的。 – 2012-03-06 22:38:55

这是真的 - 我没有足够好的阅读OP。我并不是说在这种情况下明确表示这是一件坏事，但总是在那里删除第二个'if（）'并且只有一个'else'。 – Bojangles 2012-03-06 22:47:52

$(document).ready(function() { 
    $("#mydivid").click(function() { 
     var that = $(this); 

     if(that.text() == 'Show +') that.text('Show -'); 
     else that.text('Show +'); 
    }); 
});

来源

2012-03-06 22:35:37 xandercoded

这里是一种仅现有文本做到这一点：

$(document).ready(function() { 
    $("#mydivid").click(function() { 
     $(this).text(function(i, old){ 
      return "Show "+ (/\+/.test(old)) ? '-': '+'; 
     }) 
    }); 
});

我想这是用于切换在这种情况下触发类会是一个更好的解决方案的元素，但它不是清楚完整的代码将做什么。

来源

2012-03-06 22:41:11 charlietfl

Demo

$(document).ready(function() { 
    $("#mydivid").click(function() { 
     $(this).text(function(i,text) { 
      return text === 'Show +' ? 'Show -' : 'Show +'; 
     });    
    }); 
});

来源

2012-03-06 22:45:12 shaunsantacruz

jQuery的 - 切换文本

回答

相关问题