Разрешение относительных ресурсов в контенте AJAX - PullRequest
Новая
       9

Разрешение относительных ресурсов в контенте AJAX

1 голос
/ 09 июля 2009

Я пытаюсь выяснить, как разрешить относительно ссылочные ресурсы внутри динамически загружаемого контента. Например, предположим, что у меня была загружена следующая страница с /index.html: 

<html><body>
 <div id="insert-here" />
 <script>
  $(function(){
   $("#insert-here").load("x/ajax-content.html");
  });
 </script>
</body></html>

А ajax-content.html содержит: 

<img href="foo.png"/>

Тогда foo.png будет загружено с /foo.png, а это не то, что я хочу. Мне нужно, чтобы файл foo.png был загружен относительно HTML-кода, на который он ссылается, поэтому мне нужно, чтобы он был загружен из /x/foo.png. Мне интересно, есть ли способ сделать это (кроме использования абсолютного пути в ajax-content.html)?

(Зачем мне это нужно? Я разрабатываю архитектуру плагинов на основе AJAX, которая позволяет разрабатывать и развертывать блоки содержимого страницы независимо от приложения.)

1 Ответ

3 голосов
/ 10 июля 2009

Проблема в том, что вы вставляете произвольный HTML-код в исходный документ. Браузер не может знать, что данные на самом деле взяты из другого документа. Вот разбивка того, что происходит:

DOM (до): 

<html><body>
  <div id="insert-here"></div>
</body></html>

DOM (после): 

<html><body>
  <div id="insert-here"><img src="foo.png"></div>
</body></html>

Тот факт, что рассматриваемый фрагмент HTML был взят из какой-либо другой ссылки html, теряется из-за способа вставки данных. Я бы сказал, что самое простое решение - это изменить пути в файле ajax-content.html. Вы можете сделать это либо в самом файле (возможно, автоматически через любой инструмент, загружающий плагины ajax), либо изменить пути после загрузки документа. Так что вместо того, чтобы делать 

$("#insert-here").load("x/ajax-content.html");

Вам нужно получить данные, затем настроить любые пути, а затем вставить данные в DOM. 

function updatePaths(responseText, textStatus, XMLHttpRequest) {
  // check xmlHttpRequest status code
  // parse responseText, fix up relative URLs
}
$("#insert-here").load("x/ajax-content.html", null, updatePaths);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...