0
我有一個奇怪的設計，然後被編碼爲：遍歷Previous和jQuery的標籤
<div class="white-wrap row people-grid">
<ul class="people-list row">
<li class="person row">
<div class="inner row">
<div class="image"> <img src="images/peterHarthill.png" alt="peterHarthill" width="240" height="226"> </div>
<div class="info"> <span class="name"><span>Peter</span> <span>Hartill</span></span> <span class="role">Chairman</span> <a class="selected expand-person" href="#pete1">Toggle more</a> </div>
</div>
</li>
<li class="person row">
<div class="inner row">
<div class="image"> <img src="images/peterHarthill.png" alt="peterHarthill" width="240" height="226"> </div>
<div class="info"> <span class="name"><span>Peter</span> <span>Hartill</span></span> <span class="role">Chairman</span> <a class="expand-person" href="#pete2">Toggle more</a> </div>
</div>
</li>
<li class="person row">
<div class="inner row">
<div class="image"> <img src="images/peterHarthill.png" alt="peterHarthill" width="240" height="226"> </div>
<div class="info"> <span class="name"><span>Peter</span> <span>Hartill</span></span> <span class="role">Chairman</span> <a class="expand-person" href="#pete3">Toggle more</a> </div>
</div>
</li>
</ul>
<ul class="expanded ">
<li class="tab active" id="pete1">
<article class="expand row">
<div class="info">
<h1>Perter Hartill</h1>
<h2>Chairman</h2>
<p>Peter was a Senior Audit Partner with Deloitte, based in their Birmingham office, having retired on 31st May 2008. Peter was with Deloitte for over 40 years based mainly in the Midlands but also spent time at their offices in London and Washington US. During his career he acted for most of Deloitte's major Midlands clients and one of his specialist areas was the real estate sector.
Peter became Chairman of Deeley on 1st January 2009.
Peter is married with 2 step-children and enjoys golf and other sports.
</p>
</div>
<aside>
<ul class="qualifications">
<li><strong>Qualifications</strong> Chartered Accountant</li>
<li><strong>Professional Affiliations</strong> FCA</li>
<li><strong>Start Date</strong> September 1988</li>
</ul>
<div class="share row">
<h2>Share</h2>
<ul>
<li><a href="#"><i class="fa fa-facebook" aria-hidden="true"></i></a></li>
<li><a href="#"><i class="fa fa-twitter fa-6" aria-hidden="true"></i></a></li>
<li class="linkedin"><a href="#"><i class="fa fa-linkedin" aria-hidden="true"></i></a></li>
</ul>
</div>
</aside>
</article>
<span class="collapse-btn">collapse</span> <span class="collapse-next-btn">next</span> <span class="collapse-prev-btn">prev</span>
</li>
<li class="tab" id="pete2">
<article class="expand row">
<div class="info">
<h1>Perter Hartill</h1>
<h2>Chairman</h2>
<p>Peter was a Senior Audit Partner with Deloitte, based in their Birmingham office, having retired on 31st May 2008. Peter was with Deloitte for over 40 years based mainly in the Midlands but also spent time at their offices in London and Washington US. During his career he acted for most of Deloitte's major Midlands clients and one of his specialist areas was the real estate sector.
Peter became Chairman of Deeley on 1st January 2009.
Peter is married with 2 step-children and enjoys golf and other sports.
</p>
</div>
<aside>
<ul class="qualifications">
<li><strong>Qualifications</strong> Chartered Accountant</li>
<li><strong>Professional Affiliations</strong> FCA</li>
<li><strong>Start Date</strong> September 1988</li>
</ul>
<div class="share row">
<h2>Share</h2>
<ul>
<li><a href="#"><i class="fa fa-facebook" aria-hidden="true"></i></a></li>
<li><a href="#"><i class="fa fa-twitter fa-6" aria-hidden="true"></i></a></li>
<li class="linkedin"><a href="#"><i class="fa fa-linkedin" aria-hidden="true"></i></a></li>
</ul>
</div>
</aside>
</article>
<span class="collapse-btn">collapse</span> <span class="collapse-next-btn">next</span> <span class="collapse-prev-btn">prev</span>
</li>
<li class="tab" id="pete3">
<article class="expand row">
<div class="info">
<h1>Perter Hartill</h1>
<h2>Chairman</h2>
<p>Peter was a Senior Audit Partner with Deloitte, based in their Birmingham office, having retired on 31st May 2008. Peter was with Deloitte for over 40 years based mainly in the Midlands but also spent time at their offices in London and Washington US. During his career he acted for most of Deloitte's major Midlands clients and one of his specialist areas was the real estate sector.
Peter became Chairman of Deeley on 1st January 2009.
Peter is married with 2 step-children and enjoys golf and other sports.
</p>
</div>
<aside>
<ul class="qualifications">
<li><strong>Qualifications</strong> Chartered Accountant</li>
<li><strong>Professional Affiliations</strong> FCA</li>
<li><strong>Start Date</strong> September 1988</li>
</ul>
<div class="share row">
<h2>Share</h2>
<ul>
<li><a href="#"><i class="fa fa-facebook" aria-hidden="true"></i></a></li>
<li><a href="#"><i class="fa fa-twitter fa-6" aria-hidden="true"></i></a></li>
<li class="linkedin"><a href="#"><i class="fa fa-linkedin" aria-hidden="true"></i></a></li>
</ul>
</div>
</aside>
</article>
<span class="collapse-btn">collapse</span> <span class="collapse-next-btn">next</span> <span class="collapse-prev-btn">prev</span>
</li>
</ul>
<ul class="people-list row">
<li class="person row">
<div class="inner row">
<div class="image"> <img src="images/peterHarthill.png" alt="peterHarthill" width="240" height="226"> </div>
<div class="info"> <span class="name"><span>Peter</span> <span>Hartill</span></span> <span class="role">Chairman</span> <a data-content="inbox" class="expand-person" href="#pete4">Toggle more</a> </div>
</div>
</li>
<li class="person row">
<div class="inner row">
<div class="image"> <img src="images/peterHarthill.png" alt="peterHarthill" width="240" height="226"> </div>
<div class="info"> <span class="name"><span>Peter</span> <span>Hartill</span></span> <span class="role">Chairman</span> <a data-content="peter" class="expand-person" href="#pete5">Toggle more</a> </div>
</div>
</li>
<li class="person row">
<div class="inner row">
<div class="image"> <img src="images/peterHarthill.png" alt="peterHarthill" width="240" height="226"> </div>
<div class="info"> <span class="name"><span>Peter</span> <span>Hartill</span></span> <span class="role">Chairman</span> <a data-content="peter" class="expand-person" href="#pete6">Toggle more</a> </div>
</div>
</li>
</ul>
<ul class="expanded cd-tabs-content">
<li class="tab" id="pete4">
<article class="expand row">
<div class="info">
<h1>Perter Hartill</h1>
<h2>Chairman</h2>
<p>Peter was a Senior Audit Partner with Deloitte, based in their Birmingham office, having retired on 31st May 2008. Peter was with Deloitte for over 40 years based mainly in the Midlands but also spent time at their offices in London and Washington US. During his career he acted for most of Deloitte's major Midlands clients and one of his specialist areas was the real estate sector.
Peter became Chairman of Deeley on 1st January 2009.
Peter is married with 2 step-children and enjoys golf and other sports.
</p>
</div>
<aside>
<ul class="qualifications">
<li><strong>Qualifications</strong> Chartered Accountant</li>
<li><strong>Professional Affiliations</strong> FCA</li>
<li><strong>Start Date</strong> September 1988</li>
</ul>
<div class="share row">
<h2>Share</h2>
<ul>
<li><a href="#"><i class="fa fa-facebook" aria-hidden="true"></i></a></li>
<li><a href="#"><i class="fa fa-twitter fa-6" aria-hidden="true"></i></a></li>
<li class="linkedin"><a href="#"><i class="fa fa-linkedin" aria-hidden="true"></i></a></li>
</ul>
</div>
</aside>
</article>
<span class="collapse-btn">collapse</span> <span class="collapse-next-btn">next</span> <span class="collapse-prev-btn">prev</span>
</li>
<li class="tab" id="pete5">
<article class="expand row">
<div class="info">
<h1>Perter Hartill</h1>
<h2>Chairman</h2>
<p>Peter was a Senior Audit Partner with Deloitte, based in their Birmingham office, having retired on 31st May 2008. Peter was with Deloitte for over 40 years based mainly in the Midlands but also spent time at their offices in London and Washington US. During his career he acted for most of Deloitte's major Midlands clients and one of his specialist areas was the real estate sector.
Peter became Chairman of Deeley on 1st January 2009.
Peter is married with 2 step-children and enjoys golf and other sports.
</p>
</div>
<aside>
<ul class="qualifications">
<li><strong>Qualifications</strong> Chartered Accountant</li>
<li><strong>Professional Affiliations</strong> FCA</li>
<li><strong>Start Date</strong> September 1988</li>
</ul>
<div class="share row">
<h2>Share</h2>
<ul>
<li><a href="#"><i class="fa fa-facebook" aria-hidden="true"></i></a></li>
<li><a href="#"><i class="fa fa-twitter fa-6" aria-hidden="true"></i></a></li>
<li class="linkedin"><a href="#"><i class="fa fa-linkedin" aria-hidden="true"></i></a></li>
</ul>
</div>
</aside>
</article>
</li>
<li class="tab" id="pete6">
<article class="expand row">
<div class="info">
<h1>Perter Hartill</h1>
<h2>Chairman</h2>
<p>Peter was a Senior Audit Partner with Deloitte, based in their Birmingham office, having retired on 31st May 2008. Peter was with Deloitte for over 40 years based mainly in the Midlands but also spent time at their offices in London and Washington US. During his career he acted for most of Deloitte's major Midlands clients and one of his specialist areas was the real estate sector.
Peter became Chairman of Deeley on 1st January 2009.
Peter is married with 2 step-children and enjoys golf and other sports.
</p>
</div>
<aside>
<ul class="qualifications">
<li><strong>Qualifications</strong> Chartered Accountant</li>
<li><strong>Professional Affiliations</strong> FCA</li>
<li><strong>Start Date</strong> September 1988</li>
</ul>
<div class="share row">
<h2>Share</h2>
<ul>
<li><a href="#"><i class="fa fa-facebook" aria-hidden="true"></i></a></li>
<li><a href="#"><i class="fa fa-twitter fa-6" aria-hidden="true"></i></a></li>
<li class="linkedin"><a href="#"><i class="fa fa-linkedin" aria-hidden="true"></i></a></li>
</ul>
</div>
</aside>
</article>
<span class="collapse-btn">collapse</span> <span class="collapse-next-btn">next</span> <span class="collapse-prev-btn">prev</span>
</li>
</ul>
</div>
當前的jQuery：
jQuery(document).ready(function() {
jQuery('.people-grid a').on('click', function(e){
var currentAttrValue = jQuery(this).attr('href');
jQuery('.selected').removeClass('selected');
jQuery(this).addClass('selected');
// Show/Hide Tabs
jQuery('.active').removeClass('active');
jQuery('.people-grid ' + currentAttrValue).addClass('active');
e.preventDefault();
});
jQuery('.collapse-next-btn').on('click', function(e){
jQuery('.active').removeClass('active');
jQuery(this).parent('.tab').next().addClass('active');
});
});
它基本上建立了一個標籤，但由於方式它的設計必須將其分開。
我需要下一個和上一個按鈕從當前li.tab中刪除活動類並將其添加到下一個。我可以在同一個ul中執行它，但是當它到達當前列表的結尾/開始時，不能選擇下一個ul.expanded的下一個/前一個li。
我還需要再用高亮顯示對應的按鈕「選擇」
dev的網站可以在http://deeley.devmode.co.uk/people.html被看作是我敢肯定，我可能還沒有做出太大的意義！
如果任何人都可以伸出援手，因爲我一整天都在圍繞着圈子！