SlideToggle多点击阅读更多/更少，只显示一个，隐藏他人。

Question

我怎样才能改变我的代码，当我点击一个特定read more多次和slideToggle功能改变时发出阅读更多/更少和显示/隐藏的内容，其他人留read more，但甚至当我点击其他链接read more，旧版本slideUp和新使用slideToggle功能slideDown。

我的HTML

<!-- === h1 === --> 
    <h1>Lorem ipsum dolor sit amet</h1> 
     <p>Ut enim ad minim veniam, quis nostrud exercitation.</p> 
     <p class="more">Duis aute irure dolor in reprehenderit in voluptate.</p> 
     <a class="read_more">... Read More</a> 
    <!-- === h2 === -->    
    <h2>Consectetur adipisicing elit</h2> 
     <p>On the other hand, we denounce with righteous.</p> 
     <p class="more">Gemoralized by the charms of pleasure of the moment.</p> 
     <a class="read_more">... Read More</a> 
    <!-- === h3 === -->     
    <h3>Sed do eiusmod tempor incididunt</h3> 
     <p>The wise man therefore always holds.</p> 
     <p class="more">Et harum quidem rerum facilis est et expedita distinctio.</p> 
     <a class="read_more">... Read More</a> 

我的Jquery

var rm = $(".read_more"), 
    moreText = "... Read More", 
    lessText = "... Read Less"; 

rm.click(function() { 
    rm.text(moreText); 

var $this = $(this); 
var more = $this.text($this.text() == moreText ? lessText : moreText).prev(".more").slideToggle("normal"); 

$('.more').not(more).slideUp(); 
}); 

Answer 1

你的代码几乎是正确的。只是做了这个小改动，并添加了一点CSS。

var rm = $(".read_more"), 
    moreText = "... Read More", 
    lessText = "... Read Less"; 

rm.click(function() { 
    var $this = $(this); 
    $this.prev().slideToggle(); 
    $this.text($this.text() == moreText ? lessText : moreText); 
}); 

添加以下CSS。

p.more { 
    display: none; 
} 

检查以下小提琴，http://jsfiddle.net/7ZyuP/2/