2

この問題は IE9 でのみ発生します。Firefox は、他のブラウザと同様に正常に動作します。

ユーザーが画像をアップロードするテキストエリアで (ImageManager プラグインを使用して) TinyMCE を使用しています。テキストエリアは、画像のアップロード専用です。ユーザーがtinyMCEテキストエリアに画像をアップロード/挿入してページを送信すると、フォームの送信を完了する前に、画像のサイズを編集して正しいサイズであることを確認します。

tinyMCE テキストエリアの html を JQuery オブジェクトにロードし、jquery を使用してオブジェクトの .attr("width") を呼び出し、画像が必要な幅であることを確認します。

問題は、FireFox では正常に動作し、画像の幅が返されることです。IE9 では、.attr("width") への jquery 呼び出しは 0 (ゼロ) を返します。

コードは次のとおりです。

sString = $('#projectimage1').html();   // fetch the contents of the tinymce form field
objWork.html(sString);      // load a work div with the html contents of the control
// check to see if the image has the correct dimensions
var objImage=null;
objImage = objWork.find("img:first");

alert("image html = " + objImage.html()); // this returns the correct html for the image tag, including the width
alert("image src = " + objImage.attr('src'));   // this returns the correct image src
alert("image width = " + objImage.attr("width"));   // this returns 0 in IE9!

私が問題であると考えることができる唯一のことは、画像がtinyMCEテキストエリアに表示されている間に画像の「ソースを表示」するときです-画像タグで使用されるすべてのhtmlはhtmlエンコードされています。したがって、'<' は実際にはソースに < として表示され、width="219" プロパティで使用される引用符は実際には width="219" に設定されます。

これが実際に問題である場合、IE9 には問題があるのに、FireFox には問題がないのはなぜですか?

これが問題ではない場合 - 続行/修正する方法について何か考えがある人はいますか?

専門家に感謝します！

4

1 に答える 1

1

新しく作成された画像が実際にレンダリングされるまで、ブラウザはキャッシュからの画像の読み込みを完了していない可能性があり、その幅がオブジェクトに記録されます。ブラウザーが異なれば、キャッシュからの読み込みが正確に完了するタイミングも異なります。画像の幅が必要な場合は、コピー先の場所ではなく、既に読み込まれている場所から幅を取得する必要があります。

var width = $('#projectimage1 img:first').width();

いずれの場合も、画像の幅を収集する前に、画像の読み込みが完了していることを確認する必要があります。

または、プロパティを使用して画像の読み込みが完了したかどうかを確認し、完了して.completeいない場合は onload ハンドラーをアタッチして、読み込みが完了したときにその幅を記録できるようにすることもできます。

View/Source に表示される内容についてコメントを希望する場合は、実際の Web ページへのリンクを提供してください。実際に何が起こっているかを確認できます。のような他のプロパティを適切に取得しているため.src、ブラウザが HTML を解析していない可能性は低いと思われます。

于 2012-11-24T01:42:28.520 に答える