如何预览上传的图像作为div的背景图像？

我想在div中预览上传的图像文件。 我做了一些研究，我从这篇文章中找到了这段代码，它是预览上传图像文件的代码，但是在标签中：

  function readURL(input) { if (input.files && input.files[0]) { var reader = new FileReader(); reader.onload = function (e) { $('https://stackoverflow.com/questions/16312930/how-to-preview-an-uploaded-image-as-the-background-image-of-a-div/#blah').attr('src', e.target.result); } reader.readAsDataURL(input.files[0]); } }  

相关的HTML：

很酷。 但是，我想要的是将上传的图像显示为div的背景图像，其示例如下：

我知道，从逻辑上讲，我必须更换

$('https://stackoverflow.com/questions/16312930/how-to-preview-an-uploaded-image-as-the-background-image-of-a-div/#blah').attr('src', e.target.result);

有类似的东西

$('div.image').attr('style', e.target.result); 。

但是如何使图像的路径进入“背景图像”属性的值？

是的，我需要链接到JQuery库吗？

谢谢。

Answer 1

您可以像在CSS文件中一样使用CSS简写。 我建议以下内容以避免重复和对齐问题：

改变是这样的线

 $('#objectID').css('background', 'transparent url('+e.target.result +') left top no-repeat');