раскол ответ Аякса в двух различных дивы

Question

У меня есть код Ajax, как это:

$j(document).ready(function() { 

    function loading_show() { 
     $j('#loading').html("<img src='images/loading.gif'/>").fadeIn('fast'); 
    } 

    function loading_hide() { 
     $j('#loading').fadeOut(); 
    } 

    function loadData(page) { 
     loading_show(); 
     $j.ajax({ 
      type: "POST", 
      url: "load_data.php", 
      data: "page=" + page, 
      success: function (msg) { 
       var $response = $j(msg); 

       // Query the jQuery object for the values 
       oGlobal = $response.filter('#Z').text(); 

       $j("#container").ajaxComplete(function(event, request, settings) { 
        loading_hide(); 
        $j("#container").html(msg); 
       }); 
      } 
     }); 
    } 

    loadData(1); // For first time page load default results 

    $j('#container .pagination li.active').live('click', function() { 
     var page = $j(this).attr('p'); 
     loadData(page); 
    }); 
}); 

Im получать этот ответ:

<div id="container"> 
    <div id="Z">JuanFernando</div> 
    <div id="q"> 
     <div class="pagination"> 
      <ul> 
       <li p="1" class="inactive">First</li> 
       <li class="inactive">Previous</li> 
       <li p="1" style="color:#fff;background-color:#006699;" class="active">1</li> 
       <li p="2" class="active">2</li> 
       <li p="2" class="active">Next</li> 
       <li p="2" class="active">Last</li> 
      </ul> 
      <input class="goto" size="1" style="margin-top:-1px;margin-left:60px;" 
       type="text"> 
      <input id="go_btn" class="go_button" value="Go" type="button"><span class="total" a="2">Page <b>1</b> of <b>2</b></span> 
     </div> 
    </div> 
</div> 

Я хочу, чтобы извлечь «JuanFernando» для того, чтобы показать в DIV контейнер, но один, и я хочу, чтобы остальная часть ответа могла отображаться в другом другом div, например: container2.

Answer 1

ajaxComplete - это не то, что вы хотите использовать здесь, особенно внутри вашей функции успеха. Вы хотите, чтобы ваша функция успеха выглядеть примерно так:

success: function (msg) { 
    loading_hide(); 
    var $response = $j(msg); 

    // Query the jQuery object for the values 
    oGlobal = $response.find('#Z').text(); 

    $j("#container").html(oGlobal); 

    $response.find('#Z').remove(); 
    $j('<div id="container2"></div>').html($response.html()).appendTo('body'); 
} 

Мы просто взяв oGlobal (который должен быть JuanFernando в данном случае) и приклеить ее в #container. После этого удалите #Z div из ответа и вставьте остальную часть внутри нового #container2 и добавьте его в тело или где хотите.

Answer 2

Here's an "adapted" fiddle.

В принципе, единственное, что меняется с вами код

заменить

oGlobal = $response.filter('#Z').text(); 

с

oGlobal = $response.find('#Z').text(); 

также см ответ MattDiamant в отношении ajaxComplete.