Question

我正在视图中接收url，并且正在使用JQuery将这些url分配给某些html元素。.我正在阅读视图中的url，并且看到正斜杠仍然存在。。但是在页面输出中，它们被空格代替... 这是我的代码：

    $('#someId').append("<div class='request-quote__dropdown'>
<div class='request-quote__dropdown-image' 
style='background-image: url('"+element.parent.PictureUrl+"');'>
</div></div>")

所以element.parent.PictureUrl包含的值是"https://localhost:44390/images/thumbs/0000570_ackerman_schoendorf_scales_for_parent_evaluation_of_custody_aspect_100.jpeg"，我正在使用Json.stringify()读取它。但是图像未在页面上呈现，当我检查元素时，它看起来像这样：

        <div class="request-quote__dropdown-image" 
style="background-image: url(" https:="" localhost:44390="" images="" 
thumbs=""     0000570_ackerman_schoendorf_scales_for_parent_evaluation_of_custody_aspect_100.jpeg');'=""></div>

我也尝试过这种方法，但结果仍然相同...

`<div class='request-quote__dropdown-image' style='background-image: url('${element.parent.PictureUrl}');'></div>`

我正在使用json，我读过json阻止了html元素中使用正斜杠。.不确定为什么。.如何保持正斜杠？它们是在页面上显示图像所必需的。

更新：相关的Json如下所示：

     {"parent":{"Name":"Ackerman-Schoendorf Scales for Parent Evaluation of
 Custody™ (ASPECT™)","Author":"Marc Y.Heiks, PhD and Kathleen Schand, 
PsyD","Quantities":null,"Id":2666,"PictureUrl":"https://localhost:44390/images
/thumbs/0000570_ackerman_schoendorf_scales_for_parent_evaluation_of_custody_aspect_100.jpeg"},

Answer 1

您的问题是这个

style='background-image: url('"

您在背景图片css周围有一个单引号，然后在url周围有一个单引号。这将导致它在“ url（”之后立即终止样式标签。此后的所有内容都被注册为新属性，这只会导致异常的html，其中图像名称似乎被解释为属性。

请尝试使用“ \”代替网址中的单引号。如果这样不起作用，请尝试重新排列使用单引号，双引号和转义引号的内容，直到生成正确的html。我遇到了这个确切的问题。一直可以解决这个问题。

编辑后：

 $('#someId').append("<div class='request-quote__dropdown'>
<div class='request-quote__dropdown-image' 
style='background-image: url(\""+element.parent.PictureUrl+"\");'>
</div></div>")

jQuery正斜杠被标记内的空格替换

1 个答案: