點擊jquery切換文本

我一直在試圖解決這個問題，我成功了一些，但我現在卡住了。點擊jquery切換文本

我有這樣的結構：

<h4>title</h4> 
<p>text</p> 
<hr /> 
<h4>title</h4> 
<p>text</p> 
<p>text</p> 
<hr /> 
<h4>title</h4> 
<p>text</p> 
<hr />

什麼，我只想盡力去做到的是切換的話東燃（意爲開啓）和slidding在P的上下車時verbergen（意爲隱藏）。此刻，我在詞尾添加了一個詞「tonen」，並檢查其是否顯示。

內容在加載時隱藏，顯示的是tonen，但是當點擊h4時，顯示內容但tonen不會變爲verbergen。我已閱讀過有關生活，但沒有得到它。

<script> 
    $(function(){ 
    $("h4").append("<span> - tonen</span>"); 
    $("h4").nextUntil("hr").hide(); 
    $("h4").click(function() { 
     $(this).nextUntil("hr").slideToggle("fast"); 
     if(span.text() == " - tonen"){ 
      span.text(" - verbergen"); 
     } else { 
      span.text(" - tonen"); 
     } 
    }); 
    }); 
</script>

來源

2013-05-05 Tessed

你只需要得到你目前孩子的文字點擊h4的span並切換到基於文本相反檢索範圍的文本：

$("h4").click(function() { 
    $(this).nextUntil("hr").slideToggle("fast"); 
    var text = $(this).find('span').text(); 
    $(this).find('span').text(text == " - verbergen " ? " - tonen " : " - verbergen "); 
});

Updated Fiddle

來源

2013-05-05 16:13:59 Eli

它看起來不像你曾經宣佈過你的跨度變量。你需要選擇你會被操縱的元素，那麼它應該工作：

<script> 
    $(function(){ 
     $("h4").append("<span> - tonen</span>"); 
     $("h4").nextUntil("hr").hide(); 
     $("h4").click(function() { 
      $(this).nextUntil("hr").slideToggle("fast"); 
      var $span = $(this).find('span'); 
      if($span.text() == " - tonen"){ 
       $span.text(" - verbergen"); 
      } else { 
       $span.text(" - tonen"); 
      } 
     }); 
    }); 
</script>

Demo

來源

2013-05-05 16:07:11

$("h4").append(" - <span>tonen</span>").click(function() { 
    var $sp = $('span', this); 
    $(this).nextUntil("hr").slideToggle("fast"); 
    $sp.text($sp.text()=="tonen"?"verbergen":"tonen"); 
}).nextUntil("hr").hide();

LIVE DEMO 2

$("h4").append(" - <span>tonen</span><span style='display:none;'>verbergen</span>").click(function() { 
    $(this).nextUntil("hr").slideToggle(400).end().find('span').toggle(); 
}).nextUntil("hr").hide();

來源

2013-05-05 16:24:10

這裏是一個簡短的腳本，顯示了第一款卻隱藏着所有其他人，除非單擊 '更多...'。它甚至創建'更多...'按鈕。所有你需要做的，用這個包是文本塊（其中包含若干段）之間......並啓動腳本：

<script> 
$(function(){ 
    $(".teaser p").eq(0).attr("class","clsTea"); 
    $(".teaser").after("<span class='moreTea'>more...</span>"); 
    $(".clsTea").siblings().css("background-color","yellow").hide(); 
    $(".moreTea").click(
    function(){ 
     var clktxt = $(".moreTea").text(); 
     $(".clsTea").siblings().toggle(1000,function(){ 
      if (clktxt=='more...'){ 
       $(".moreTea").text('less...'); 
      } else { 
       $(".moreTea").text('more...'); 
      } 
     }); 
    }); 
}); 
</script>

我希望這有助於

來源

2014-11-13 13:04:56 Clinton

點擊jquery切換文本

回答

相關問題