$(‘window’).loadでFlash内に組み込んでいる関数を実行、みたいな処理をしていたのですが、Google Chromeでだけ微妙に想定した挙動と違っていたのでメモ。
サンプルコード
HTML
#flash内にFlashを埋め込んでいます。
<div id="flash"></div>
JavaScript
Flashは対応している端末のみ埋め込まれるようにしていたので、Flashがあるかどうか(#flash内に要素があるかどうか)を確認してから、Flash内で用意していた関数(flashFunction();)を実行しています。
$(window).on('load', function() { if($('#flash').children().length) { flashFunction(); } });
これで問題ないかと思っていたのですが、Google Chromeでたまにうまく動作していませんでした。
最初にアクセスした時は問題なかったのですが、2回目以降にキャッシュが残った状態でアクセスするとうまく動作せず、そこからリロードを行うときちんと動作しました。
うまくいっていない時は「Uncaught TypeError: undefined is not a function」とFlash部分でエラーが出ていたので、Flashが読み込まれる前に関数を実行してしまっているような気がします。
そのため、キャッシュのない1回目のアクセスとリロードをした時にはきちんと動作しているのかなと推測。
解決方法
解決方法が思いつかなかったので、あまりいい方法ではありませんが、setTimeoutでタイミングをずらして対応しました。
JavaScript
$(window).on('load', function() { if($('#flash').children().length) { setTimeout(function() { flashFunction(); }, 2000); } });
2015.05.03追記
色々と調べてみた結果、Flashは$(‘window’).loadの読み込みに含まれるようです。
今回の場合、Flash内で動画ファイルを参照して読み込むようにしていたのですが(flashFunction();で動画再生)、$(‘window’).loadはFlash自体を読み込んだかどうかは見ますが、Flashから読み込んでいる外部ファイルは含まれていないみたいです。
そのため、動画ファイルが読み込まれる前にflashFunction();を実行するとエラーが出るようでした。
コメントが承認されるまで時間がかかります。