画像がうまく読み込めない問題に遭遇した。
ちなみに、Androidは問題ないけど、iOSで発生。
そのときの解決方法をメモとして残しておきます。
iOS7系、8系の実機端末で動作確認をしていた。
かつ、UIWebViewにHTMLを設定して表示するだけの初期表示は問題はなし。
その後に、JQueryの$("#{該当するid}").html({該当するタグ}) などで、部分的に
HTMLの内容を変更したときに、その変更内容にimgタグが含まれている場合に
imgタグのsrc属性に設定している画像が存在するにもかかわらず
画像が読み込みを行わないという事象だった。
解決には、次の手順で行った。
1. 次の関数を作成。
(imgタグのwidthが0だったら、画像が読み込まれてないと判断し
0.1秒後に再度、本関数を再度呼び出して、imgタグのsrc属性を設定し直して、画像を読み込ませるようにする。)
2. 前述した問題が発生するHTMLの内容変更後に、1.で作成した関数を実行する。
- function editImage(id, imgSrc) {
- var img = new Image();
- if (imgSrc == null) {
- img.src = $(id).attr('src');
- } else {
- img.src = imgSrc;
- }
- if (img.width == 0) {
- setTimeout(function() { editImage(id); }, 100);
- img = null;
- return;
- } else {
- $(id).attr('src', img.src);
- $(id).css('visibility', 'visible');
- img = null;
- }
- }