使用变量转义url的Jquery

Question

试图在jquery中附加一个动态变量，用于转义和html，而我在ajax中引入了一个动态变量，而我似乎无法得到正确的转义。我有的是-

$("<div><div class='presiImg' style='background: url(/\'/gleam\/public\/images\/itPrecedents\/" + keep.logo + "');'></div></div>").appendTo(".myDiv');

我不知道如何正确转义这个变量，所以我可以使用这个变量。谢谢。

Answer 1

你这里有几个问题：

1. 您正在转义URL中的正斜杠，这是不必要的。
2. 在.appendTo()中使用不一致的引号

作为建议，当我使用JS/jQuery追加原始HTML时，我尝试使用单引号和JavaScript引号，然后在HTML中使用双引号。对我来说，这样看就更容易了。另外，CSS url中的单引号也不是必需的，而且可能会混淆这件事。

无论如何，如果您将行更改为以下内容，它将有效：

$('<div><div class="presiImg" style="background: url(\'/gleam/public/images/itPrecedents/' + keep.logo + '\');"></div></div>').appendTo('.myDiv');

下面有一个可运行的示例，如果您想要看到它正在运行的话：

​

$(function() {
  
  var keep = { logo : "test.jpg" };
  $('<div><div class="presiImg" style="background: url(\'/gleam/public/images/itPrecedents/' + keep.logo + '\');"></div></div>').appendTo('.myDiv');
  
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="myDiv"></div>

​

Answer 2

试一试

$("<div />",{ 
 "class":"presiImg",
 "style":"background: url(/gleam/public/images/itPrecedents/"+keep.logo+")"
}).appendTo(".myDiv");