Подгрузка контента с других страниц

Подгрузка контента с других страниц

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

jQuery-функция:

Код
(function($) {
  $.lebnikLoad = function(selector, url, callback){ $(document.body).lebnikLoad(selector, url, callback, true); };
  $.fn.lebnikLoad = function(selector, url, callback, without_selector_document){
  var selector_document = this;
  var e = $('<iframe style="display:none" src="'+url+'"></iframe>');
  $(document.body).append( e );
  $(e).load(function(){
  var x = $(selector, e[0].contentWindow.document);
  if(callback){
  callback(x);
  }else if(without_selector_document != true){
  $(selector_document).html( $(x).html() );
  }
  });
  };
})(jQuery);


Синтаксис применения:
Код
$.lebnikLoad(selector_on_url, url, complete_callback(responseSeleced))


Пример:
В блок #div нужно вставить содержимое блока #content_from который имеется на странице http://you-site.ru/page
Код
$("#div").lebnikLoad("#content_from", "http://you-site.ru/page");


Следует учесть важные моменты:
В момент подгрузки страницы (iframe-а) происходит выполнение всех JavaScript-ов (в iframe-е), следовательно после вставки обработанных данных, события яваскриптов тоже будут работать, с одной стороны это плюс, но с др. стороны это может ввести программиста в заблуждение, особенно, когда подгруженный контент имеет свои JavaScript-ы (). Таким образом то, что указано в при вставке будет выполнено уже на текущей странице, и может получится не только двойной эффект JavaScript-обработки контента, но и ненужная доп. обработка контента текущей страницы.

Надеюсь, функция пригодится многим разработчикам.

avatar