управления Javascript из Iframe страницы переходов

Question

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

мне удалось создать IFRAME с тремя HTML-страницы динамически загружаются в последовательности каждые 1500ms (www.online95.com/ agency.html)

На каждой странице html, загружаемой в iframe (/ budget, html ,untary.html и robust.html), я добавил строку кругов (white = off и red = on), которая если щелкнуть, загрузите соответствующую страницу в iframe

Проблема в том, что исходный скрипт не связан с отдельными страницами html, так что исходная последовательность продолжает загружаться каждые 1500 мс независимо от того, какую страницу вы загрузили вручную в iframe или когда вы ее загрузили.

Я ищу некоторый скрипт для сохранения переменных в исходном javascript на /agency.html, чтобы следующая dymanic загрузки страницы будет один после страницы вручную загружен и отдыха таймер

Кроме того, я хотел бы иметь возможность добавить кнопку паузы

Большое спасибо

Answer 1

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

Я бы сохранил элементы управления на родительской странице. Вы можете заставить их казаться наложенными, используя position:absolute; z-index:2; и top/bottom: XYZpx; left/right: ABCpx;, чтобы правильно разместить их (а также родительский position:relative) и исправить настройки фона.

Тогда все, что вам нужно будет сделать, это сохранить таймер в переменной (var timer = window.setTimeout(...)) и отменить его, когда пользователь нажимает одну из клавиш (controls.onclick = function(timer) { window.clearTimeout(timer); })

Answer 2

Прежде чем ответить на ваш вопрос, я должен сказать, что это очень плохая практика, вы можете использовать jQuery и jQuery Slider Plugin, это будет более эффективно.

Выполнение чего-то более сложного с iframe, но вы можете это сделать.Вы должны использовать IFrame OnLoad событие для изменения текущего индекса страницы (я),

вот как вы можете сделать,

<script type="text/javascript"> 

var pages=new Array(); 
     pages[0]="/budget.html"; 
     pages[1]="/voluntary.html"; 
     pages[2]="/robust.html"; 

var i=0; 
var time=4000; // this is set in milliseconds 
var timer = false; 
var timerSetter; 

function pageChange() { 
document.getElementById("agencyframe").src=pages[i]; 
i++; 
if(i==pages.length) { 
    i=0; 
} 
timerSetter = setTimeout("pageChange()",time); 
} 

function contentChanged(e) { 
    if (!timer) { pageChange(); timer=true;} 
    if (timerSetter) { 
     clearTimeout(timerSetter); 
     timerSetter = setTimeout("pageChange()",time); 
    } 
    var newSrc = e.contentWindow.location.href; 
    for (var j=0; j < pages.length; j++) { 
     if (newSrc.match(pages[j])) { 
      i = j+1; 
      if(i==pages.length) { 
       i=0; 
      } 
     } 
    } 
} 
</script> 

И не забудьте установить OnLoad атрибут для фрейма,

<iframe id="agencyframe" onload="contentChanged(this)" src="/budget.html"> 
</iframe> 

UPDATE:

Как я понимаю, вы хотите изменить IFrame страницы, когда пользователь нажмет (страница нулевой страницы на одной странице два) on this page.

Вы можете изменить расположение фрейма, как это,

document.getElementById("agencyframe").src = "/budget.html"; 

так изменить свою функцию, как это,

function pageZero() { 
    document.getElementById("prin_div1").setAttribute("class", "prin_on"); 
    document.getElementById("prin_div2").setAttribute("class", "prin_off"); 
    document.getElementById("prin_div3").setAttribute("class", "prin_off"); 
    document.getElementById("agencyframe").src = pages[0]; 
} 

function pageOne() { 
    document.getElementById("prin_div1").setAttribute("class", "prin_off"); 
    document.getElementById("prin_div2").setAttribute("class", "prin_on"); 
    document.getElementById("prin_div3").setAttribute("class", "prin_off"); 
    document.getElementById("agencyframe").src = pages[1]; 
} 

function pageTwo() { 
    document.getElementById("prin_div1").setAttribute("class", "prin_off"); 
    document.getElementById("prin_div2").setAttribute("class", "prin_off"); 
    document.getElementById("prin_div3").setAttribute("class", "prin_on"); 
    document.getElementById("agencyframe").src = pages[2]; 
} 

UPDATE -2:

Изменение contentChanged функции как это,

function contentChanged(e) { 
    if (!timer) { pageChange(); timer=true;} 
    if (timerSetter) { 
     clearTimeout(timerSetter); 
     timerSetter = setTimeout("pageChange()",time); 
    } 
    var newSrc = e.contentWindow.location.href; 
    for (var j=0; j < pages.length; j++) { 
     if (newSrc.match(pages[j])) { 
      i = j+1; 
      document.getElementById("prin_div"+i).setAttribute("class", "prin_on"); 
      if(i==pages.length) { 
       i=0; 
      } 
     } else { 
      document.getElementById("prin_div"+(j+1)).setAttribute("class", "prin_off"); 
     } 
    } 
}