jquery 요소의 전체 HTML을 얻는 방법

Question

이것은 내 첫 번째 게시물이지만 수년간 사이트를 사용해 왔습니다. 그러나, 나는 페이징 (pagination)과 관련하여 상당히 간단한 문제가 무엇인지에 집착하고있다. 나는 PHP로 채워지는 링크 그룹을 가지고있다.

function create_pagination($page,$echo=false) 
    { 
    $max_rows = isset($_SESSION['maxListViewRows']) ? $_SESSION['maxListViewRows'] : 15; 
    $total_rows = isset($_SESSION['total_rows']) ? $_SESSION['total_rows'] : 1; 
    $pages = ceil($total_rows/$max_rows); 

    if($page > $pages) $page = $pages; 

    $start_row = $page == 1 ? 1 : (($page - 1) * $max_rows) + 1; 

    $rows_disp = ($start_row + $max_rows) <= $total_rows ? ($start_row + $max_rows) - 1 : $total_rows; 

    $facility_number_summary = 'Showing ' . $start_row . ' - ' . $rows_disp . ' of ' . $total_rows . ' rows.<br /> <p class="carapg">(MESSAGE IRRELEVANT TO THE QUESTION)</p>'; 

    $pagination_functions = ''; 

    for($i = 1; $i <= $pages; $i++) 
    { 
     $pagination_functions.= $i != $page ? '<a href="javascript:void(0);" id="page_' . $i . '" class="page_link">' . $i . '</a>' 
             : '<span class="page_link" id="page_' . $i . '">' . $i . '</span>'; 
    } 

    $results = array('facility_number_summary'=>$facility_number_summary, 'pagination_functions'=>$pagination_functions); 

    $returned = '<div id="max_left">' . $results['facility_number_summary'] . '</div> 
       <div id="max_right">' . $results['pagination_functions'] . '</div> 
       <div class="break"></div>'; 

    if($echo){ echo $returned; return; } 

    return $returned; 
    } 

그리고 나서 jquery로 div를 구문 분석하고 압축한다

function draw_pagination(page) 
{ 
if(page == undefined){ 
    page = 1; 
} 
var postData = { 'ajax' : 'pagination', 
        'page' : page    }; 

$.ajax({ 

    type : "POST", 

    url : "/ajax/account.php", 

    data : postData, 

    success : 
     function(data){ 
      $("#fac_results_max").html(data); 
      get_page_count(); 
     } 

}); 

} 

function get_page_count() 
{ 
var count = $("#max_right").children().length; 

if(count < 11) 
    return; 

var content = ''; 
var spacer = false; 

$("#max_right").children().each(
    function(index) 
    { 
     if($(this).html() > 5 && $(this).html() <= (count - 5) ) 
     { 
      $(this).css('display','none'); 
      if(!spacer) 
      { 
       content += '...'; 
       spacer = true; 
      } 
     } 
     else 
     { 
      content += $(this).html(); 
     } 
    } 
); 

$("#max_right").html(content); 
} 

나는 숨겨진 요소를 가져다가 떨어 뜨린 div에 추가하여 사용자가 선택할 수 있도록하려고합니다. 내가가 예상대로 제가하는 데 문제는, 그것은 단지 HTML의 내부를 반환하는

content += $(this).html() 

이지만, 나는 전체의 실제 HTML을 반환하는 데에 전화를 모르겠어요 요소 'this'에 의해 참조됩니다. 그것이 바보 같은 질문이라면 미안하지만 나는 혼란 스럽다.

미리 답변 해 주셔서 감사합니다.

Answer 1

이 시도 :

content += $(this).clone().wrap('<div>').parent().html();

AFAIK는, 내용 및 jQuery를 사용하여 요소의 태그를 얻을 수있는 더 좋은 방법이 존재하지 않기 때문에 대신에 우리는 요소를 복제, 그것을 포장 <div> 태그의 경우 부모 (<div>)까지 충돌 한 다음 의 HTML을 가져옵니다.

Answer 2

content += $(this).parent().html(); 

그리고 'this'요소에 더미 래퍼를 지정하십시오.

또는도 시도하지만

content += $(this).contents(); 

Answer 3

가 왜 그냥 $ ('# 대상')를 사용 관련이있을 수 있습니다 ($ (이)) 추가합니다.; ?

첫 번째 자식의 HTML이 아닌 whol 요소를 원하면 요소 만 사용하십시오.

http://api.jquery.com/category/attributes/

Answer 4

개별 요소를 html 문자열로 변환 할 필요가 없습니다. 간단히 몇 가지 수학 및 슬라이스() 메서드를 사용하십시오. http://api.jquery.com/slice/

편집 : 실제로 아약스 성공에 대한 수익을 삽입하기 전에 수행해야합니다. 삽입 할 필요없이 반환 된 HTML을 조작 할 수 있습니다, 다음 조작

예 후 삽입하는 것은 아닙니다 100 % 미세 조정하지만,이

function get_page_count() 
{ 
    /* cache jQuery objects when needing to search them again for efficiency*/ 
    var $max=$("#max_right"), $kids=$max.children() 
    var count = $kids.length; 

    if(count < 11) 
     return; 

    var $temp=$('<div/>').append($kids.slice(0,5)).append('...').append($kids.slice(- 5,-1)); 

    $max.html(temp.html()); 
}