无法将图像src设置为动态创建的div

我试图设置在JavaScript上创建的div的背景网址。这将用于Jquery Orbit滑块。这是我如何做到的。无法将图像src设置为动态创建的div

var content 1 = null 
$("#featured").html("<div id='content' style=''>"); 
content1 = document.getElementById("content"); 
content1.style.background="url(" + imageUrlList[0] + ")";

imageUrlList来自于此。

imageUrlList.push(document.getElementById("image1Container").src)

它从另一个图像标签获取src。所以我们的目标是获取图片标签的src，并将其设置为通过javascript创建的div（内容）的背景。问题是，它不在那里。我试着看着检查元素。网址在那里，我认为它是在base64，不知道。但它在那里。你认为是什么问题？有任何想法吗？谢谢！

更新：当用户在一个文件对话框，选择一个图像我显示图像。该图像将显示在图像容器的图像标签上。这些是我想要获取的源图像并将其显示给内容div

function readURL(input, x) { 
    if (input.files && input.files[0]) { 
     var reader = new FileReader(); 


     reader.onload = function (e) { 
      if(x == 1) 
      {$('#image1Container').attr('src', e.target.result);} 
      else if(x == 2) 
      {$('#image2Container').attr('src', e.target.result);} 
      else if(x == 3) 
      {$('#image3Container').attr('src', e.target.result);} 
      else if(x == 4) 
      {$('#image4Container').attr('src', e.target.result);} 
      else 
      {$('#image5Container').attr('src', e.target.result);} 

     } 

     reader.readAsDataURL(input.files[0]); 
    } 
}

来源

2013-09-05 ljpv14

这是很难理解的问题，没有看到该页面的源代码的其余部分。有没有其他相关的代码可以在这里发布？ –

为什么你使用jQuery和普通的JavaScript？ – putvande

查看我更新的帖子。 – ljpv14

看起来imageUrlList [0]没有被括在引号中。我不知道，但也许你可以尝试：

content1.style.background="url('" + imageUrlList[0] + "')";

来源

2013-09-05 15:31:06

仍然没有图像。 – ljpv14

似乎有不高于足够信息，但喜欢用数据流的（Base64），而不是一个真正的URL到图像您几乎看。确保你的背景值包含所有数据的相应属性编码的内容：

URL（“数据：图像/ PNG; BASE64，[数据]）

源：http://www.w3.org/TR/mwabp/#bp-conserve-css-images（3.4.7.2）。

来源

2013-09-05 15:47:08 nopuck4you

我试过这个，它的工作原理是如果div不是通过javascript创建的。 – ljpv14

您可以使用此 -

$('#content').css('background-image', 'url("' + imageUrlList[0] + '")');

来源

2013-09-05 15:56:26 AkshayP

无法将图像src设置为动态创建的div

回答

相关问题