jquery - 显示一个段落，然后单击隐藏另一个段落？

Question

<p>好吧，当您单击一个链接并打开另一个链接时，我试图隐藏一个标签<p>标签。

但是，我知道这很容易，但我无法让它工作......

那么，有人可以检查我的 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 事件并将 HTML 与 javascript 分开。（不显眼的 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;
}

见小提琴。