Jquery 테이블 행을 순환합니다.

-3

jQuery를 설정하여 테이블 행을 순환시켜야합니다. 표에는 항상 한 행만 표시되어야합니다. 링크를 클릭하면 이전 행이나 다음 행이 표시됩니다.Jquery 테이블 행을 순환합니다.

기본 HTML 구조는 다음과 같습니다

<div> 
<a href="">Next</a> 
<table> 
    <tr><td>text1</td></tr> 
    <tr><td>text2</td></tr> 
    <tr><td>text3</td></tr> 
    <tr><td>text4</td></tr> 
</table> 
<a href="">Previous</a> 
</div>

어떤 도움을 주시면 감사하겠습니다.

출처

2012-01-31 ChandraZ

무엇이 문제입니까? 너 뭐 해봤 니? 무슨 문제에 빠지셨습니까? –

"행 순환"이란 무엇을 의미합니까? – PeeHaa

첫째, 당신의 요소에 ID를 부여 :

<a id="next" href="">Next</a> 
<table id="myTable"> 
    <tr><td>text1</td></tr> 
    <tr><td>text2</td></tr> 
    <tr><td>text3</td></tr> 
    <tr><td>text4</td></tr> 
</table> 
<a id="prev" href="">Previous</a>

을 그리고, 첫 번째 제외한 모든 요소를 숨길 수 :

마지막으로

$("#myTable tr").hide().eq(0).show();

, "다음"과 "이전"버튼을 전환하기를 인접한 형제 자매의 가시성 (존재하는 경우) :

출처

2012-01-31 22:08:27 mgibsonbr

"자전거 타기 '의 의미가 명확하지 않습니다. 행, "하지만 일부 빌딩 블록 : 당신은 CSS 선택기를 사용할 수 있습니다

는 (거의 모든 CSS3 plus some의)는 DOM의 요소를 찾을 수 있습니다. 당신은 on를 통해 이러한 이벤트를 연결할 수 있습니다
```
var links = $('a'); 
```
(또는 경우에 당신은 jQuery를, bind의 이전 복사본을 사용하고 있습니다) : 예를 들어,이 모든 a 요소를 찾습니다.
이벤트를 처리하면 이벤트가 DOM을 버블 링 방지하기 위해 ((링크를 다음에서 링크를 클릭 방지, 예를 들어) 이벤트의 기본 동작을 방지하기 위해 preventDefault를 사용 및/또는 stopPropagation 수 있습니다) 또는 이벤트 처리기에서 false을 반환하여 둘 다 수행하십시오.
jQuery는 set 기반이므로 jQuery 인스턴스는 여러 요소를 둘러싼 래퍼가 될 수 있습니다. var rows = $('tr');.
jQuery 인스턴스에 색인을 생성하여 일치하는 세트의 해당 지점에있는 원시 DOM 요소에 액세스 할 수 있습니다. rows[2]은 세트의 세 번째 행입니다. 예를 들어 그래서

, 당신이 당신의 "다음"링크 클래스 "next"을 추가 한 경우 :

<a href="" class="next">Next</a>

이 ... 당신이 click 이벤트를 선택기로를 찾아 후크 수 :

를

그래서 "현재"행에 대한 색인을 유지하고 해당 행을 래핑하는 jQuery 인스턴스에 색인을 지정하고이를 클릭 할 때 어떤 작업을 수행 할 수 있습니다.

API docs을 통해 1 시간 또는 2 시간 독서를 할 가치가 있습니다. 문자 그대로 오래 걸리면 큰 보상을받을 수 있습니다.

출처

2012-01-31 22:08:43

Jquery 테이블 행을 순환합니다.

답변

관련 문제