аякс подгрузка без перезагрузки
 

Здравствуйте! Подскажите пожалуйста в моей проблеме. Есть скрипт:

(function ($) {
        var $categoryProducts = $('#ajax-content');
        $('body').on('click', 'a', function(e){
            console.log($(this).attr('href'));
			e.preventDefault();
            History.pushState(null, document.title, $(this).attr('href'));
        });
 
        function loadPage(url) {
          $('#container').css({opacity: 0.5});
		  setTimeout(function() {
           //$categoryProducts.load(url + " #ajax-content > *",function(){
			  //$('#container').css({opacity: 1});
           //});
		   
		   	$.ajax({
               url:     url + '&ajax=1',
			   dataType : "html",
			   type: 'get',
			   cache: false,
               success: function(data){
                   $categoryProducts.html(data);
				   $('#container').css({opacity: 1});
               }
            });
		 },1000);  
        }
 
        History.Adapter.bind(window, 'statechange',function(e){
            var State = History.getState();
            loadPage(State.url);
        });
})(jQuery);

Он подгружает контент без перезагрузки страницы, но он подгружает полностью всю страницу (вместе с head), а мне нужно получить только нужный контент. Как это сделать без использования php?

При использовании для подгрузки:

$categoryProducts.load(url + " #ajax-content > *",function(){
			  $('#container').css({opacity: 1});
           });

вместо:

$.ajax({
               url:     url + '&ajax=1',
			   dataType : "html",
			   type: 'get',
			   cache: false,
               success: function(data){
                   $categoryProducts.html(data);
				   $('#container').css({opacity: 1});
               }
            });

Все подгружается как надо, но не работают скрипты в подгружаемом контенте. Подскажите может нужно что то включить что бы при получении $.ajax данных они как то склеивались с уже существующим или удалялось все лишнее. Или подскажите почему не работают скрипты при использовании .load() и как их заставить заработать. Не знаю как объяснить поэтому спрашивайте объясню подробнее. Помогите уже 4 дня бьюсь, гугл не объясняет или я не знаю как искать.

Jigan2,
А где находятся скрипты в подгружаемом контенте?
Ведь в варианте load вы грузите не все, что отдает сервер, а только #ajax-content

Скрипты находятся в том файле который подгружается в #ajax-content

Jigan2,
http://api.jquery.com/load/

Цитата:
 Script Execution

When calling .load() using a URL without a suffixed selector expression, the content is passed to .html() prior to scripts being removed. This executes the script blocks before they are discarded. If .load() is called with a selector expression appended to the URL, however, the scripts are stripped out prior to the DOM being updated, and thus are not executed. An example of both cases can be seen below:

Here, any JavaScript loaded into #a as a part of the document will successfully execute.

$( "#a" ).load( "article.html" );
However, in the following case, script blocks in the document being loaded into #b are stripped out and not executed:

$( "#b" ).load( "article.html #target" );

Таким образом, при load с указанием селектора скрипт не просто не работает, а удаляется из загружаемого контента.
Как вариант выхода из ситуации - грузить без селектора страницу, в которой размещено только нужное

Спасибо я уже нагуглил про это

А почему тогда такой срабатывает?

<script type="text/javascript">
alert('работает');
</script>

А такой уже нет

<script type="text/javascript">
$(function(){
alert('работает');
});
</script>

В общем я решил эту проблему посредством php т.е. при использовании аякс подгрузке php отделяет не нужный контент, а если пользователь впервые грузит страницу то отдаю весь контент т.е. header, footer
И вместо load() использую

$.ajax({
               url:     url + '&ajax=1',
			   dataType : "html",
			   type: 'get',
			   cache: false,
               success: function(data){
                   $categoryProducts.html(data);
				   //$('#container').css({opacity: 1});
               }
            });

А как можно удалить не нужный контент при подгрузке без селектора например удалить header, footer

И первый и второй работают (я попробовал), только при load без селектора - с селектором в загруженном коде их просто не будет.


И правильно - load удобнее использованием селекта, который в этом варианте не нужен