Question

我试图设置在javascript上创建的div的背景网址。这将用于Jquery Orbit滑块。以下是我的表现方式。

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]);
    }
}

Answer 1

似乎imageUrlList [0]没有用引号括起来。我不确定，但也许你可以试试：

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

Answer 2

上面似乎没有足够的信息，但它几乎看起来像是使用数据流（base64）而不是图像的真实URL。确保您的背景值包含数据编码内容的所有适当属性：

url（'data：image / png; base64，[data]）

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

Answer 3

你可以使用它 -

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

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

3 个答案: