jQuery - 斜杠无缘无故地被空格替换

Question

我有一个 jquery 代码:

$('.image_thumb').click(function() {
 var big_image = $('.image_thumb').attr('src').replace('thumbs/','').replace('skin/','');
 alert(big_image);
   $('body').html('<div style="position: absolute; left: 0; top: 0; width: 100%; height:100%; background-color: #000000; background: url("..'+big_image+'") center center no-repeat;"></div>'
);
});

当我单击 .image_thumb 元素时，它首先显示一个警报，即“images/work/1/image.png”。但是当 div 加载时，背景中的 url 值如下所示:“images work 1 image.png” - 所有斜杠都替换为空格。有人可以解释一下到底是什么吗？ :))谢谢。

有趣，但是下面的代码可以完美运行:

    $('.image_thumb').click(function() {
 var big_image = $('.image_thumb').attr('src').replace('thumbs/','').replace('skin/','');
 alert(big_image);
   $('body').html('<div style="position: absolute; left: 0; top: 0; width: 100%; height:100%; background-color: #000000;"><img src="'+big_image+'"></div>'
);
});

只有一个问题 - 这样我就无法将图像居中(因为我不知道宽度和高度)，所以我几乎坚持第一个选项。

Answer 1

我自己找到了解决方案，它非常...嗯...愚蠢:

$('.image_thumb').click(function() {
 var big_image = $('.image_thumb').attr('src').replace('thumbs/','');
 alert(big_image);
  $('body').html('<div style="position: absolute; left: 0; top: 0; width: 100%; height:100%; background: url('+big_image+') #000000 center center no-repeat;"></div>'
);
});

background:url() 中的双引号由于某种原因造成干扰。

另一件事是，我必须删除 .replace('skin/','') 并且不在 url() 中使用 ..，现在一切都工作得很好。