jquery转义字符问题？

Question

我有这个jquery问题，似乎只在使用背景图片网址时才会中断。我的印象是它看起来像是一个角色逃脱问题，但我可能是错的。

以下是我正在使用的演示版本：http://jsfiddle.net/W4CZG/

基本上我在html中有一些带有内联样式的可拖动div：

<div class="dragme" style="background-color:#ccc;">1</div>
<div class="dragme" style="background-image:url(images/image1.gif);">2</div>

在脚本上，我目前使用以下内容在可放置区域内添加span标记来设置样式：

$(this).html('<span style="' + draggable.attr('style') + '"></span>');

第一个div，背景色，效果很好。看着萤火虫，它创造了类似的东西：

<span style="background-color: rgb(204, 204, 204);"></span>

如果我使用任何其他样式 - 如边距，字体等 - 它也有效。但是我的问题，也就是我的问题，在这里，背景图片，生成的span标签没有得到背景图片的内联样式，反而搞砸了？在萤火虫中我看到了：

<span );="" image1.gif="" images="" style=""></span>

这是一个charcater逃避问题吗？更重要的是，我该如何解决这个问题？

谢谢你的时间！

Answer 1

你应该做

$('<span/>', { style: draggable.attr('style') })

这将为您解决所有逃避问题。

在你的情况下，

$(this).html('<span style="' + draggable.attr('style') + '"></span>');

会变成

$(this).html($('<span/>', { style: draggable.attr('style') }));