顯示一段，然後單擊一下即可隱藏另一段？

Question

那麼，我試圖隱藏一個<p>標記，當你點擊一個鏈接，並在同一時刻打開另一個<p>標記。

但是，我知道這很容易，但我無法得到它的工作...

因此，有人可以check my jsFiddle？我做錯了什麼，我無法讓它工作。

HTML

<a onclick="$('.text1').hide('slow')" onclick="$('.text2').show('slow')">Read more</a> 

<p class="text1">This is a randomtext.</p> 
<p class="text2">This line will rule the world one day.</p> 

CSS

a { 
    text-decoration: underline; 
} 
.text2 { 
    display: none; 
} 

Answer 1

我會建議你使用jQuery events和獨立的HTML從JavaScript。 （Unobtrusive JavaScript）

選擇添加到您的 「我讀」 是這樣的：

<a class="readMore" >Read more</a> 

而在.js文件，它的工作：

//using the .readMore class as a selector for the click event over it. 
$('.readMore').click(function(){ 
    $('.text1').hide('slow'); 
    $('.text2').show('slow'); 
}); 

在這裏，你有工作：http://jsfiddle.net/BCdMa/4/

Answer 2

這是你需要什麼？

<a onclick="$('.text1').hide('slow');$('.text2').show('slow')">Read more</a> 

看到這個小提琴：http://jsfiddle.net/BCdMa/2/

Answer 3

您需要使用toggle方法：

<a onclick="$('.text1, .text2').toggle('slow')">Read more</a> 

<p class="text1">This is a randomtext.</p> 
<p class="text2">This line will rule the world one day.</p> 

，並設置像這樣的CSS：

a { 
    text-decoration: underline; 
} 

.text2{ 
    display:none; 
} 

see fiddle。