在FireFox中为img元素设置src时出现Javascript问题 - 字符串解析错误？

我在页面上遇到图像问题。我使用Javascript来创建元素，并且在FireFox中，似乎我用来设置innerHTML的字符串未被正确解析。当服务器页面被请求使用无效的GET变量时，我会看到这一点。他们看起来像这样（从PHP脚本的错误处理程序）：在FireFox中为img元素设置src时出现Javascript问题 - 字符串解析错误？

GET[] = Array 
(
    [shrink] => true 
    [file_id] => \' file_id \' 
    [refresh] => \' now.getTime() \' 
)

这只是发生约5％的要求，这是使它难以解决。我已经能够在FireFox中自己重现这一点，并且Firebug将显示它尝试获取的URL是：https://www.domain.com/secure/%27%20+%20image_src%20+%20%27

我在某处读到它可能与FireFox预取内容有关（现在无法找到它googling ），因为它似乎只发生在FireFox上。在about：config 中禁用预取，可以防止问题发生，但我正在寻找另一种解决方案或解决方法，它不涉及最终用户更改其配置。

以下是详细信息和代码：我在HTML页面上有一个空的表格单元格。在该页面的JQuery的$（document）.ready（）函数中，我使用JQuery的$ .ajax（）方法从服务器获取有关应该在该单元中的内容的一些数据。它返回file_id变量，为简单起见，我只是在下面设置。然后它将空表格单元设置为具有带有src的图像，该图像指向将根据传递的file_id来服务图像文件的页面。这部分代码最初是JQuery，所以我将其改为直接使用Javascript，但这并没有什么帮助。

//get data about image from server 
//this is actually done through JQuery's $.ajax() but you get the idea 
var file_id = 12; 

//create the src for the img 
//the refresh is to prevent the image from being cached ever, since the page's 
//javascript will be it changes 
//during the course of the page's life 
var now = new Date(); 
var image_src = 'serve_image.php?shrink=true&file_id=' + file_id + '&refresh=' + now.getTime(); 

//create 
document.getElementById('image_cell').innerHTML = 
    '<A target="_blank" href="serve_image.php?file_id=' + file_id + '">' + 
     '<IMG id=image_element src="' + image_src + '" alt="Loading...">' + 
    '</A>';`

任何帮助将不胜感激。谢谢！

来源

2010-05-19 Kevin

Wayyy阅读很多... – 2010-05-19 13:08:23

真正的“file_id”值究竟是什么样子？ – Pointy 2010-05-19 13:46:57

它们是整数，通常在500 - 1500的范围内。 – Kevin 2010-05-19 15:02:04

它看起来像你混合双引号和单引号。由于您的代码示例进行了修改，我不能肯定，但我的猜测是，这条线：

var image_src = 'serve_image.php?shrink=true&file_id=' + file_id + '&refresh=' + now.getTime();

真是这样的待遇：

var image_src = "'serve_image.php?shrink=true&file_id=' + file_id + '&refresh=' + now.getTime()";

是您的JavaScript由PHP产生，还是它在一个单独的文件？如果您在线输出JavaScript，则可能需要考虑将其放在单独的* .js文件中，以减少PHP对引号的处理不会干扰JavaScript引号的可能性。

希望这会有所帮助！

来源

2010-05-19 16:24:04 jimbojw

感谢您的想法。是的，我认为我只是在报价上犯了一个错误，因为这就是它的样子。但请记住，这只发生在约5％的页面请求中。不断重新加载页面需要几分钟的时间来重现错误。如果它只是一个错字错误，这将发生在每个页面请求。 – Kevin 2010-05-19 16:41:27

我最初发现这个错误，因为每隔几天就会有一个来自serve_image.php的错误日志条目，即使该页面的使用频率比这更频繁。 – Kevin 2010-05-19 16:44:36

代替改变document.getElementById("image_cell").innerHTML，尽量让你的<一个>的ID，做

 
document.getElementById('a_tag_id_here').href = 'serve_image.php?file_id=' + file_id; 
document.getElementById('image_element').src = image_src;

如果不能设置的锚标签的ID，还有其他的DOM的功能，更容易得到。关键是，我认为改变innerHTML是你的问题的根源。

来源

2010-05-19 19:29:55

如果在通过ajax获取图像数据之前没有这些元素，则可以在服务器端创建占位符对象，或者使用DOM方法创建它们。在这种情况下，我建议使用涉及新Image（）而不是document.createElement（'img'）的方法来实现跨浏览器兼容性（我遇到过IE和创建img标签的问题。如果需要更多信息，我可以提供。 – 2010-05-19 19:32:12

在FireFox中为img元素设置src时出现Javascript问题 - 字符串解析错误？

回答

相关问题