jquery切換標籤

如何獲得標籤切換顯示/隱藏？下面是我的代碼，目前它也顯示節目。我希望它從顯示切換到隱藏並從隱藏切換到顯示。當顯示節目的股利將被隱藏，但點擊顯示標籤時會切換到隱藏和股利將會顯示出來，當隱藏在單擊標籤將回到顯示和股利會被隱藏jquery切換標籤

<html> 
<head> 
<title>jQuery test page</title> 
<script type="text/javascript" src="../scripts/jquery-1.4.2.js"></script> 

<script type="text/javascript"> 
$(document).ready(function() { 
$("#clickMe").click(function() { 
$("#textBox").toggle(); 
}); 
}); 
</script> 
</head> 
<body> 
<label id="clickMe">Show</label> 
<br /> 
<div id="textBox" style="display: none">This text will be toggled</div> 
</body> 
</html>

來源

2011-11-30 Juan Almonte

如果我看了你的問題的權利，那麼，我覺得有以下將工作：

$('#clickMe').toggle(
      function(){ 
       $('#textBox').show(); 
       $('#clickMe').text('hide'); 
      }, 
      function(){ 
       $('#textBox').hide(); 
       $('#clickMe').text('show'); 
      });

JS Fiddle demo。

如果您使用屬性for，來定義該label「連接」，並且還採用了類名，然後這可以更通用的和有益的元素：

$('.clickMe').toggle(
      function(){ 
       $('#' + $(this).attr('for')).show(); 
       $(this).text('hide'); 
      }, 
      function(){ 
       $('#' + $(this).attr('for')).hide(); 
       $(this).text('show'); 
      });

JS Fiddle demo。

但請記住，label元素用於將信息與特定的input元素相關聯，而不是任意元素的通用標識符。理想情況下，您應該使用span或div元素，而不是label用於此目的。

如果切換到使用非label元素，則for屬性也不應使用，在它的地方，我建議（假設之間有什麼目前label和div相同的連接）使用自定義data-*屬性（如data-for）來標識關係。

另請注意，在上面的例子-final-，使用class代替id選擇器，由於id必須是文檔中是唯一的。

來源

2011-11-30 01:49:31

使用具有回撥功能的Toogle：http://api.jquery.com/toggle-event/

然後您可以在每個回調中設置標籤的文本。

answer這裏講的是不同的切換API調用。

來源

2011-11-30 01:46:20

在切換之前或之後添加下面的代碼。

http://jsfiddle.net/UuADb/

label = $(this); 
if(label.html()=="Show"){ 
    label.html('Hide'); 
}else{ 
    label.html('Show'); 
}

來源

2011-11-30 01:51:09

jquery切換標籤

回答

相關問題