Вызов функции или фокусировка программно сгенерированного Iframe из холста HTML5

Question

У меня есть холст HTML5, который управляется и генерируется библиотекой файлов JavaScript (в основном, в библиотеке Craftyjs).
Холст генерирует 2 регулярных html-фрейма (тот же домен), которые сложены друг на друга.
Контекст canvas между двумя iframes на основе вызовов от iframes к родительскому, поэтому я знаю, что код, управляющий холстом, легко доступен их общим родителям.

Я хочу, чтобы родительский холст мог либо вызвать функцию в iframe, чтобы сосредоточиться на определенном элементе в них, либо каким-то образом просто иметь фокусы iframes вообще.
Я также предпочел бы не постоянно перезагружать/воссоздавать фреймы, чтобы получить фокус.

---- In the Iframe ---- 
//The head has a function "focusThis()" to focus on an element in the iframe 
//body also has onfocus="focusThis();"  

//Call the parent to change to the other iframe 
parent.changeIframe(); 

---- In the parent's canvas JS code ---- 

// I know the function and will hide/show the iframe, but it won't focus 
function changeIframe(){ 

    //For now, just switch randomly 
    MODE = Math.floor(Math.random()*2); 

    //I am hiding the iframes here, then showing the one that should be seen 
    Crafty("Game1").each(function() {this.visible = false}); 
    Crafty("Game2").each(function() {this.visible = false}); 

    //Switch the iframes 
    if(MODE){ 
     //Show this iframe 
     Crafty("iframe1").each(function() {this.visible = true}); 

Эти вещи я пытался заставить работать
Когда он не выдаст ошибку, что ничего в хроме или FireFox не делать.
(Объект [объект глобальный] не имеет метод «focusThis») является общей ошибкой

 //document.getElementById('iframe1').focus(); 
    //document.getElementById("iframe1").contentWindow.focusThis(); 
    //document.getElementById('iframe1').contentWindow.focusThis(); 

    //var iframe_window = window.frames["iframe1"]; 
    //iframe_window.focus(); 
    //iframe_window.contentDocument.body.focus(); 

    //window.parent.document.getElementById('iframe1').contentWindow.focusThis; 
    //window.parent.document.getElementById('iframe1').contentWindow.focusThis(); 

    //window.frames["iframe1"].focus(); 
    //window.frames["iframe1"].contentWindow.focus(); 
    //window.frames["iframe1"].contentDocument.focus(); 

    var frame = document.getElementById("iframe1"); 
    if(frame){ 
      alert("yep"); 
       frame.contentWindow.focusThis(); 
     } 
    } 
    else{ 
      //....Same thing but for iframe2 
    } 
} 

Любая помощь будет высоко оценили.

Answer 1

Я решил свою проблему после еще более возиться.
Это также решило мою проблему, не перезагружая iframe.

Я установил таймер в функции onload каждого iframe, который пытается сфокусироваться на элементе сам по себе на основе переменной родительского флага (MODE), которая сообщает iframe, если он должен иметь фокус и внутреннюю переменную (сфокусированный), который говорит, что он перестает пытаться сфокусироваться, как только он снова сосредоточится.

Где-то в голове ...

 var focused = false; 
     function focusThis(){ 
      if(parent.MODE && !focused){ 
       document.getElementById("SOME_ELEMENT_I_WANT_FOCUSED").focus(); 
       focused = true; 
      } 
     } 

Где-то в OnLoad ...

var autoFocus = 
     setInterval(function(){if(parent.MODE && !focused) focusThis()},500); 

Где-то в скрипте ниже тела ...

parent.changeIframe(); 
changeImage(); 
if(!parent.MODE){ 
    //This element is just to have a place for focus to go when out of focus 
    document.getElementById("NA").focus(); 
    focused = false; 
} 
else 
    focused = true;