2012-05-09 3 views
2

Я хочу, чтобы загрузить содержание моей страницы внутри сНу элемента с помощью этой функции:сделать DIV ведут себя как IFRAME

function loadmypage(DIV, pageURL) 
{ 
var xmlhttp; 
if (window.XMLHttpRequest) 
    {// code for IE7+, Firefox, Chrome, Opera, Safari 
    xmlhttp=new XMLHttpRequest(); 
    } 
else 
    {// code for IE6, IE5 
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
xmlhttp.onreadystatechange=function() 
    { 
    if (xmlhttp.readyState==4 && xmlhttp.status==200) 
    { 
    document.getElementById(DIV).innerHTML=xmlhttp.responseText; 
    } 
    } 
xmlhttp.open("GET", pageURL ,true); 
xmlhttp.send(); 
} 

Однако, когда я нажимаю на ссылку внутри «кадра» сама функция не Работа. Думаю, причина в том, что целевой элемент находится на другой странице с загруженной страницы .

Так что мой вопрос: Есть ли способ заставить элемент div вести себя как iframe при загрузке всей страницы внутри самого кадра?

PS: Из соображений безопасности я не могу использовать iFrame по соображениям безопасности ни по jQuery. ссылки на главной странице загружают цель нормально, проблема возникает, когда я нажимаю любую ссылку внутри этих страниц.

+8

Обе причины в PS - просто глупость. – kapa

+0

После того, как вы поместили responseText в свой div, это та же самая страница. – Jage

+0

показать свои ссылки, которые вы нажимаете, а также функцию, которую вы используете для настройки события click – Jage

ответ

3

Ваши ссылки не работают, потому что вам не хватает аргумента div. Обратите внимание на свою функцию:

function loadmypage(DIV, pageURL) 
{ 
... 

Первый аргумент - DIV, и вы передаете только страницуURL.

<li><a href= "javascript:loadmypage('viewMessages.php')">Messages</a></li> 
              <li><a href= "javascript:loadmypage('userHomepage.php')">My Conferences</a></li> 
              <li><a href= "javascript:loadmypage('availableConferences.php')">Conferences</a></li> 
              <li><a href= "javascript:loadmypage('incomingRequests.php')">Requests</a></li> 
0

<div> не может быть сделано, чтобы вести себя как по любой установке или переключатель, если вы представить себе что-то подобное. В конце концов, если вы хотите , вы должны использовать .

В любом случае, ссылки, которые не работают, возможно, используют относительную адресацию. Это разумное ожидание внутренних ссылок на странице. Чтобы они работали со своей страницы, вам придется использовать абсолютные адреса.

Так что, если вы загрузили страницу

www.example.com/somedirectory/index.php 

и он использовал

<link href="style.css" > 

Вы должны использовать

<link href="www.example.com/somedirectory/style.css" > 

т.д.

Таким образом, вы можете пройти через DOM Дерево, ищу link, a, img и все другие элементы, использующие адрес в каком-либо атрибуте, проверяя эти атрибуты, проверяя, используют ли они абсолютный адрес (может быть сделано с регулярным выражением, но я не дам вам его сейчас, так как есть много возможностей : http://something..., www.something.com/... или даже localhost/...), а если нет, ссылаясь на них абсолютно (добавив весь путь к веб-странице и директории, в которой находился загруженный документ).

Вы можете пересечь дерево DOM с помощью рекурсивной функции, начиная с посещения document.body и для каждого посещенного узла, вызывая функцию для всех своих дочерних элементов. Хотя в вашем случае вы можете воспользоваться document.getElementsByTagName, чтобы получить именно списки конкретных элементов, которые вам нужны.

Наконец, обратите внимание, что из-за соображений безопасности сценарии должны быть включены с одного и того же хоста (IP и ровный порт). Поэтому сценарии из других веб-страниц не будут работать для вас удаленно.Вам также придется загружать их на свой сервер.

TLDR: Вам не нужен jQuery, но используйте .

Смежные вопросы