如何使用兩個不同的鏈接擴展一個部分？

Question

我創建了一個帶有第二個導航菜單的網頁，點擊該網頁後，向下滾動頁面到相關部分。

在這些部分中，我有一個文本區域，使用點擊來擴展閱讀更多按鈕。

我想要做的是實現一個功能，當導航（.toplinks＃section1）的鏈接也被點擊時，這個功能將擴展這個部分，以便它自動擴展而不必單擊閱讀更多按鈕。

<li class="top-li-double"> 
<a class="toplinks" href="#section1">Section 1</a> 
</li> 
<br/> 
<div id="slips" class="explain"> 
<h2 class="categoryhead">SECTION 1</h2> 
<p> 
Lorem Ipsum is simply dummy text of the printing and typesetting industry. 
Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, 
</p> 
<div class="wrapper"> 
<div class="small"> 
<p> 
Lorem Ipsum is simply dummy text of the printing and typesetting industry. 
Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, 
</p> 
</div> 
<div style="margin-top:5px"> 
<a class="readmoretext" href="#">Click to read more</a> 
</div> 
</div> 
</div> 

jQuery的腳本：

$('.wrapper').find('a[href="#"]').on('click', function (e) { 
e.preventDefault(); 
this.expand = !this.expand; 
$(this).text(this.expand?"Read Less":"Click to read more"); 
$(this).closest('.wrapper').find('.small, .big').toggleClass('small big'); 
}); 

我曾經對這個在JS提琴戲，看fiddle 但沒有運氣。如果有人能夠在正確的方向上給我一個推動力，我會非常感謝！

Answer 1

我已經重寫了一下你的代碼，你可以看到完整的工作示例here。

我已經添加了幾個部分和鏈接，以便您可以看到它的尺寸很好。

JS：

$('.readmoretext').on('click',function() { 
    this.expand = !this.expand; 
    $(this).closest('.wrapper').find('.small, .big').toggleClass('small big'); 
    $(this).text(this.expand?"Read Less":"Click to read more"); 
}) 


$('a.toplinks').on('click', function (e) { 
     var l = $(this).attr('href') 
     $(l).find("a.readmoretext").click(); 
}); 

HTML：

<a class="toplinks" href="#section1">Section 1</a> 
<div id="section1" class="explain"> 

我已經添加了一個id到div.explain所以如果可以它滾動到的元素。

基本上代碼只是找到ID是一個孩子，調用click事件