Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 07.08.2015, 10:03
Интересующийся
Отправить личное сообщение для vadval15 Посмотреть профиль Найти все сообщения от vadval15
 
Регистрация: 13.04.2013
Сообщений: 13

Обработчик изменения истории в браузере для iframe некорректно работает
При нажатии ссылки её обработчик вставляет изображение в iframe с соответствующим изменением адресной строки браузера:
1. Фрагмент главной страницы HTML
<form name="F1" id="F1" action="http://site.com/cgi-bin/cgiproject1.cgi" method="POST" target="ram">
  <input type="text" name="E1" id="E1" style="display: none" value="" maxlength=1>
  <input type="submit" name="B1" id="B1" style="display: none" value="">
</form>
<iframe name="ram" id="ram" style="position: absolute; left: 46%; top: 200px; width: 540px; height: 484px" FRAMEBORDER=0 SCROLLING="no"></iframe>

2. Фрагмент загружаемого содержимого IFRAME
<BODY ONLOAD="setupHistoryClicks()">';
  <div id="gam" style="position: absolute; left: 2px; top: 2px; color: white; height: 460px; width: 536px; background-color: #f16529">
   <p><a id="photoaddr" href="http://site.com/tst/name1.html">Addr &gt;</a></p>;
   <figure id="photo"><img id="photoimg" src="http://site.com/tst/gam/photo1.jpg" width="500" height="375">
   <figcaption>Text1</figcaption></figure></div></BODY>

3. Обработчик события CLICK
function swapPhot(href) {
  ct=["name1.html","name2.html","name3.html","name4.html","name5.html","name6.html"];
  var j,ck=href.split("/").pop();
  for (var i=0;i<6;i++){if (ck==ct[i]){j=i;}}
  var bd=String(j);
   document.getElementById('E1').value=bd;
   document.forms.F1.submit();
  return true;
}
function addClicker(link) {
  link.addEventListener("click", function(e) {
  if (swapPhot(link.href)) {
   parent.history.pushState(null, null, link.href); 
   e.preventDefault();}}, true);
} 
function setupHistoryClicks() {
  addClicker(document.getElementById("photoaddr"));
}

При попытке навигации по сайту с помощью соответствующих кнопок обработчик данного события вначале ведёт себя так, как будто записи в истории продублировались, а затем последние вообще начинают неожиданно пропадать:
4. Обработчик события POPSTATE
function supports_history_api() {
  return !!(window.history && history.pushState);
}
function swapPhoto(href) {
  ct=["name1.html","name2.html","name3.html","name4.html","name5.html","name6.html"];
  var j,ck=href.split("/").pop();
  for (var i=0;i<6;i++){if (ck==ct[i]){j=i;}}
  var bd=String(j);
   document.getElementById('E1').value=bd;
   document.forms.F1.submit();
  return true;
}
window.onload = function() { var c="name1.html";
  if (!supports_history_api()) {return;}
  swapPhoto(c);
  window.setTimeout(function() {
    window.addEventListener("popstate", function(e) {e.preventDefault();
    swapPhoto(location.pathname);
    }, false);     
  }, 1);
}

В итоге возникает проблема: при использовании iframe навигация по сайту становится практически невозможной, в то время как при использовании компонента XMLHttpRequest с аналогичными обработчиками событий всё работает нормально. Буду признателен за объяснение причины указанной проблемы.

Последний раз редактировалось vadval15, 07.08.2015 в 10:42.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Метод duration() для <video> некорректно работает в Опере Zachary Opera, Safari и др. 0 10.08.2012 12:15
jCart. Не работает ajax для динамически созданных товаров. Whitetown jQuery 2 09.03.2012 08:31
$('#id') не работает для некоторых элементов tmvrus jQuery 10 12.10.2010 15:45
dragSelector для iframe помогите написать Golizart ExtJS 0 25.07.2010 15:35
Некорректно работает функция для создания элементов exec Общие вопросы Javascript 4 13.07.2010 11:15