2016-04-22 3 views
0

ОК, так вот настройка. У меня есть расширяемый баннер, который сводит HTML-код меньшего начального баннера к более крупному расширяющемуся баннеру. (В этом тесте он расширяется с ширины 160 пикселей в ширину до 600 пикселей). У меня также есть вторая страница HTML-страницы для конкретной сцены в моей экспортированной Tumult Hype (программе анимации HTML 5).Функция postMessage не работает с window.onload?

Функция

"postToHype()"

использует PostMessage, чтобы подсовывать ко второму HTML документа HypeExample сказать ему, чтобы открыть второй сцены документа. Итак, в теории, что происходит, это объявление не только расширяет и загружает второй документ HTML, но также перескакивает на вторую сцену в этом документе.

Это работает для меня; он запускает функцию postToHype(), когда я навешиваю на нее объявление. Это также работает, когда я тестировал с помощью кнопки, которая также запускает

«комбинат()»

функцию. Функция "объединить()", также активизирует функцию

"AutoExpand()"

который открывает объявление в течение 7 секунд, а затем закрывает его снова.

То, что я не могу получить на работу, имеет window.onload call «комбинация();» функция. Когда window.onload запускает «comb()», «autoExpand()» работает, но «postToHype()» этого не делает. Почему кнопка click и onmouseover работают с моей функцией postToHype(), но «window.onload» нет?

Не весь код показан здесь (например, связанные библиотеки .js), но я попытался включить наиболее подходящие биты. Любые идеи приветствуются.

<head> 
<script type="text/javascript"> 
     var exampleHTMLToPage = ExpandableBanners.banner("exampleHTMLToPage", "HypeExample.html", 600, 600); 
     exampleHTMLToPage.setCloseImage("images/close.png", 'right', 'bottom'); 
     exampleHTMLToPage.animated = true; 
     exampleHTMLToPage.setDirection('down', 'right'); 
     animated = true; 
     exampleHTMLToPage.expandOnClick = false; 
if (document.addEventListener) { 
document.addEventListener("DOMContentLoaded",function(){documentReady=true; 
});} 
else if (!window.onload) window.onload = function(){documentReady=true;} 
</script> 

<script type="text/javascript"> 
function autoExpand() { 
setTimeout("ExpandableBanners.openAd('exampleHTMLToPage')",0000); 
setTimeout("ExpandableBanners.closeAd('exampleHTMLToPage')",7000); 
} 
</script> 

<script> function combine() { 
autoExpand(); 
postToHype(); 
} </script> 

<script> 
function postToHype(){ 
document.getElementById('exampleHTMLToPage_expanded_media').contentWindow.postMessage(['start', 'Scene2'], '*') 
} 
</script> 
</head> 

<body> 
    <div onmouseover="postToHype()" id="exampleHTMLToPage" style="width:150px; height:600px; background-color:rgb(30,167,221); position:relative; color:white; font-weight:bold"> 
    <div style="display:inline-block; 
    width:140px; font-size:22px; margin-top:20px; margin-left:5px; margin-right:5px;">This is an HTML banner RK V7. Click to see exported HYPE interactive that loaded inside.</div> 
    </div> 
<button onclick="combine();">Click me</button> 
</body> 

<script> 
window.onload = function(){ 
    combine(); 
};</script> 
+0

Каков целевой контекст 'postMessage'? Элемент 'iframe'? – guest271314

+0

Это потому, что вы вызываете функцию, которая не была загружена. Попробуйте написать Combine() в postToHype() – Zorken17

+0

@ Zorken17 - Я думаю, вы вводите в заблуждение * определяете * функцию с ее вызовом. – Quentin

ответ

-1

Изменить его облегченный это:

<script type="text/javascript"> 

function autoExpand() { 
    setTimeout("ExpandableBanners.openAd('exampleHTMLToPage')",0000); 
    setTimeout("ExpandableBanners.closeAd('exampleHTMLToPage')",7000); 
} 

function postToHype(){ 
    document.getElementById('exampleHTMLToPage_expanded_media').contentWindow.postMessage(['start', 'Scene2'], '*') 
} 

function combine() { 
    autoExpand(); 
    postToHype(); 
} 

</script> 

Вам необходимо определение функции postToHype(), прежде чем вы вызываете его. И лучше просто использовать один тег сценария и записать в него весь свой код.

+1

Я не могу найти нигде, который пытается называть 'postToHype' до того, как он существует, поэтому, хотя это сделает код более аккуратным, я не вижу в этом никакого значения. – Quentin

+0

В вызове window.onload comb() колдует postToHype(). И если postToHype() не загружен (определяет), он получит неопределенное значение – Zorken17

+0

Почему бы не загружать postToHype до того, как произойдет событие загрузки окна? Сценарий, определяющий postToHype, не загружается динамически. – Quentin

Смежные вопросы