2

此问题仅出现在 IE9 上。Firefox 工作正常，其他浏览器也一样。

我在用户上传图像的文本区域上使用 TinyMCE（带有 ImageManager 插件）。textarea 专门用于上传图片。当用户将图像上传/插入到 tinyMCE 文本区域并提交页面时 - 我编辑检查图像尺寸以确保其尺寸正确，然后才能完成表单提交。

我将 tinyMCE textarea 的 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 中看到的内容，您必须给我们一个指向实际网页的链接，这样我们才能看到那里真正发生了什么。因为您正在正确获取其他属性.src，所以浏览器似乎不太可能不解析 HTML。

于 2012-11-24T01:42:28.520 回答