onErrorイベントを機能させようとしていますが、これまでのところInternet Explorer 9でのみ機能します。いくつかのコードを試しましたが、基本的には次のようになります。
<img class="a_toc_image" src="' + asap.imgurl + '" onError="this.src=\'images/no_image.png\';" />
- Internet Explorer 9:
- 成功:データベースから画像を取得します
失敗:no_image.pngを表示します
Chrome 20.0.11:
- 成功:データベースから画像を取得します
失敗:空白だけ
Firefox 14.0.1:
- 成功:データベースから画像を取得します
- 失敗:壊れた画像アイコン
このコードの多くの主に美的なバリアント(「または」を省略または挿入するなど)は、同様の結果をもたらします。この特定のバリアントは、Iexplorerでスタックオーバーフローを引き起こしましたが、それ以外は何も変更されていません。
<img class="a_toc_image" src="' + asap.imgurl + '" onError=this.src="\images/no_image.png()" />
ここで何が問題になっているのか、なぜIexplorer 9でしか機能しないのかを誰が教えてくれますか?
ありがとう!
-添加:
ロードに失敗した画像でChromeの「要素の検査」を使用すると、次のように表示されます。
<img class="a_toc_image" src="images/no_image.png" onerror="this.src='images/no_image.png';">
正しい出力を生成しているように見えますが、何らかの理由で画像が表示されませんよね?今、.pngの代わりに.jpgを入れようとしましたが(Chromeでは.png画像が表示されない可能性があります)、それでも何も解決されません。
-追加2、先行コード
// General functions
var open_mask = function () {
//Get the screen height and width
var maskHeight = $(document).height();
var maskWidth = $(window).width();
//Set height and width to mask to fill up the whole screen
$('#mask').css({'width':maskWidth,'height':maskHeight});
//transition effect
$('#mask').fadeIn(1000);
$('#mask').fadeTo("fast",0.7);
};
var center_dialog = function (dialog) {
//Get the window height and width
var winH = $(window).height();
var winW = $(window).width();
var dialog_top = (winH/2-dialog.height()/2) + $(window).scrollTop();
var dialog_left = (winW/2-dialog.width()/2) + $(window).scrollLeft();
dialog_top = (dialog_top >= 0) ? dialog_top : 0;
dialog_left = (dialog_left >= 0) ? dialog_left : 0;
dialog.css('top', dialog_top);
dialog.css('left', dialog_left);
};
//function that creates posts
var updatepostHandler = function(postsJSON) {
$.each(postsJSON,function(i,asap) {
if(i === 0) {
first = asap.first;
last = asap.last;
} else {
if(asap.type === 'article') {
$('<div></div>') //create the HTML
.addClass('solid')
.html('<div class="titbox">' + asap.title + '</div> \
<div class="boxinsolid"> \
<div class="aubox">' + asap.authors + '</div> \
<div class="doibox"> DOI: ' + asap.doi + ' </div> \
<div class="joubox">' + asap.journal + '</div> \
</div> \
<div class="imgbox"> \
<img class="a_toc_image" src="' + asap.imgurl + '" onError="this.src=\'images/no_image.png\';" /> \
</div>')
.click(function(e) {
open_details(e, asap.id);
})
.prependTo($('#container'))
.slideDown('slow')
} else if(asap.type === 'ad') {
$('<div></div>') //create the HTML
.addClass('ad')
.html('<div class="titbox">' + asap.title + '</div> \
<div class="boxinsolid"> \
<div class="aubox">' + asap.authors + '</div> \
<div class="doibox"> </div> \
<div class="joubox">' + asap.company + '</div> \
</div> \
<div class="imgbox"> \
<img class="a_toc_image" src="' + asap.image + '" onError="this.src=\'images/no_image.png\';" /> \
</div>')
.click(function(e) {
open_details(e, asap.ad_id);
})
.prependTo($('#container'))
.slideDown('slow')
}
};
});
};