Jquery - 각 행에 특정한 변수에 액세스 하시겠습니까?

Question

나는 웹 페이지와 PHP 임 데이터베이스를 quering 그래서 같은 테이블에 결과를 표시하여이 :

<table id="tablelist"> 
<thead> 
<tr> 
<th>Header1</th> 
<th>Header2</th> 
<th>Header3</th> 
</tr> 
</thead> 
<tbody> 
<tr> 
<td>Info here1</td> 
<td>Info here1</td> 
<td class="actions">Action1 - Action2 - Action3</td> 
</tr> 
<tr> 
<td>Info here2</td> 
<td>Info here2</td> 
<td class="actions">Action1 - Action2 - Action3</td> 
</tr> 
</tbody> 
</table> 

이제 각 행은 데이터베이스에서입니다 행에 고유 한 고유 정보를 가지고 있습니다. 예를 들어 주 ID, 날짜 및 카테고리. 누군가 행에 대한 작업을 클릭하면 클릭 한 행에 해당하는 2 가지 정보를 얻을 필요가 있습니다. 현재이 작업을 시도 :

<div class="row_data">{info2 in json format}</div>  
<tr> 
    <td>Info here1</td> 
    <td>Info here1</td> 
    <td class="actions">Action1 - Action2 - Action3</td> 
    </tr> 
<div class="row_data">{info2 in json format}</div>  
<tr> 
    <td>Info here2</td> 
    <td>Info here2</td> 
    <td class="actions">Action1 - Action2 - Action3</td> 
    </tr> 

누군가가 작업 링크를 클릭하면 json 형식의 row_data의 이전 값을 가져옵니다. jquery를 사용하여 json 값을 파싱하고 나머지 jquery 코드에서 찾은 정보를 사용합니다. 그러나 이것은 잘못된 html이며 권장되지 않는다고 들었습니다. 액션을 클릭 할 때 사용할 행 당 동적 데이터를 이야기하여 jquery 코드에서 참조 할 수있는 권장/최적 방법은 무엇입니까? 당신은 다음

$("#foo").data("something") 

거기 저장된 정보에 액세스 할 수 있습니다

<tr id="foo" data-something="put whatever you want in here"> 
    <!-- content --> 
</tr> 

이 data-something의 값은 당신이 좋아하는 무엇이든 될 수있다 (:

Answer 1

그것을 할 수있는 방법은 5의 데이터 속성을 사용하여 HTML입니다 PHP에서 직접 반향 출력하는 경우 htmlspecialchars을 통해 필터링되는 한), 더 편리하다면 일반적으로 여러 데이터 속성을 사용할 수 있습니다.

주제에 post by John Resig도 있습니다.

Answer 2

Jon의 제안은 작동하지만 HTML에 데이터를 포함하는 것이 싫기 때문에 ID에서 데이터로 JSON 맵을 만들고 TR에 해당 ID를 추가합니다. 클릭 핸들러에서 TR의 ID를 가져 와서지도에서 데이터를 찾습니다.

내가 피곤 해요 그리고 내가 완전히 잘못을 제안하는 경우 그래서 용서해주십시오 오해했다고 생각

Answer 3

는 ... 그래서 어떤 사람이 어떤 행의 행동 하나를 클릭 말한다. json_info의 HTML이 올바른 형식의 JSON 문자열이 될 수있을 것입니다 다음의 경우 아마도 당신은 ... 당신이 당신의 링크를 "조치"라는 클래스를 제공 가정 각 링크에 클릭 리스너를 통해

<tr> 
    <td class="json_info" style="display:none">{your json string}</td> 
    <td>Info 1</td> 
    <td>Info 2</td> 
    <td><a class="action">action link</a></td> 
</tr> 

$('.action').click(function(){ 
    var json = $(this).parent().find('.json_info').html(); 
}); 

을 시작할 것이다 이 jquery 선택 호출에서 json으로 바로 읽습니다.