Настройка HTML внутри iFrame - Javascript не работает

Question

Я искал сообщения javascript/iFrame на StackOverflow около 45 минут, и я собрал несколько больших ресурсов, однако я не могу заставить javascript правильно функционировать внутри iFrame. Я прикрепил два скриншота с веб-сайта, в котором у меня есть iFramed внутри моего. IFrame всплывает с открытым меню, которое занимает 60% кадра. Я хотел бы добавить класс в меню, чтобы закрыть его автоматически при загрузке моей страницы. Я думаю, что у меня есть правильный JS, но я не могу заставить его функционировать. Класс не будет добавлен вообще.

Это мой и Javascript плавающего фрейма изменить Див идентификатор «расширен» класса. Я знаю, это звучит глупо, но расширенное название класса для закрытого меню. Любая помощь будет оценена! Благодарю.

<iframe src="http://dayzdb.com/map#2.065.045" style="width:500px; height:300px;" id="dayzdb"></iframe> 

     <script>$("#dayzdb").contents().find("#mapContainer").addClass("expanded")</script> 

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

http://dayzdb.com/map

Answer 1

Вы используете один и тот же домен в вашей странице и ваш IFRAME? Не забывайте о политике cross-domain, иначе это не сработает! Если у вас есть контроль над обоими сайтами, вы можете использовать метод postMessage для передачи данных в разных доменах. Очень простой пример:

// framed.htm: 
window.onmessage = function(event) { 
    event.source.postMessage(document.body.innerHTML, event.origin); 
}; 

// Main page: 
window.onmessage = function(event) { 
    alert(event.data); 
}; 

// Trigger: 
// <iframe id="myframe" src="framed.htm"></iframe> 
document.getElementById('myframe').contentWindow.postMessage('','*');