Как вызвать событие из родительского окна на основе содержимого iframe?

Question

Я создаю виджет с использованием iframe, и я хочу скрыть iframe в конкретном событии.

Скажем main.html файл имеет:

<div id="my_widget"> 
    <iframe src="www.mysite.com/main.html" width="50%" frameborder="0" height="550" id="my_iframe">Error uploading the frame.</iframe> 
</div> 

widget.html файл содержит:

<div id="widget-status-div" status="success"></div> 

Я пытался добавить сценарий, конец файла widget.html для доступа к родительскому окну (main.html), например:

<script type="text/javascript">  
    setTimeout(function(){ 
     parent.$("#my_widget").fadeOut(300, function() { parent.$("#my_widget").remove(); }); 
    }, 3000);  
</script> 

Но, к сожалению, это не сработало.

Другая вещь, которую я пытался сделать, это установить setInterval (check_iframe, 5000) в родительском окне (main.html), чтобы проверить виджет Status-Див DIV в IFRAME каждые 5 секунд, но проблема что я не могу каким-то образом проверить содержимое iframe (или, может быть, я ошибаюсь).

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

Благодаря

Answer 1

Это не получится наиболее likley из-за того же происхождения-политики. Он ограничивает доступ JavaScript с одного протокола и домена на другой.

Для получения дополнительной информации об этом вы можете проверить wiki entry

Для достижения перекрестного происхождения связи вы можете использовать API обмена сообщений определяется here.

С помощью этого api вы можете определить прослушиватель событий в одном файле и триггер в другом.

Прослушивание сообщений:

window.addEventListener("message", receiveMessage, false); 

function receiveMessage(event) 
{ 
    if (event.origin !== "http://example.org:8080") 
    return; 

    // ... 
} 

отправить сообщение в другой документ:

var parentWindow = window.parent; 

// When the popup has fully loaded, if not blocked by a popup blocker: 

// This does nothing, assuming the window hasn't changed its location. 
parentWindow.postMessage("The user is 'bob' and the password is 'secret'", 
        "https://secure.example.net"); 

Вы можете оформить полный пример в MDN Documentation