在jquery字符串中包含background-image url css

如何在jquery字符串中包含css样式background-image：url（”）。 这个字符串在url处打破（’

var img=field.img; $(".wrapper").append("
"); 

Answer 1

字符串断开，因为[style =]之后的开头单引号在[url（]处结束。由于字符串已包含单引号和双引号，因此必须转义第3个。

更改

你应该改变代码

 $(".wrapper").append("
"); 

至

 $(".wrapper").append("
"); 

例

 var field = { img: "https://upload.wikimedia.org/wikipedia/commons/thumb/f/fa/140626_Tierser_Alpl_Rossz%C3%A4hne.jpg/245px-140626_Tierser_Alpl_Rossz%C3%A4hne" } var img=field.img; $(".wrapper").append("
"); 

 .slide {display:inline-block;width:400px;height:400px;} 

Answer 2

您可以使用jQuery(html, attributes) 。 注意， css url()函数中的URL不需要引号。

 $(function() { var field = { img: "http://placehold.it/100x100" } var img = field.img; var div = $("
", { "class": "slide bgimage", "style": "background-image: url(" + img + ")" }); $(".wrapper").append(div); }); 

 .wrapper, .wrapper div { width: 100px; height: 100px; display: block; } 

Answer 3

插入/追加div元素并不是一个好习惯，就像您可能考虑更改为这种格式一样

 var img=field.img; var imgUrl='img/' + img +'.jpg'; var divElement=jQuery("
"); divElement.addClass('slide'); divElement.addClass('bgimage'); divElement.css('background-image',imgUrl); $(".wrapper").append(divElement); 

希望能帮助到你