html div不能同时显示图像和文本吗？
html div不能同时显示图像和文本吗？
提问于 2011-07-21 02:43:43
我正在使用jquery的draggables和droppables，我不明白为什么我有一个div，
<li class="ui-widget-header"><img style="position: relative; left: 10px; top: 50px;" src=""></img></li>似乎无法同时显示图像和文本。上面的div是我的droppable；我正在尝试将图像和文本拖到其中。当我首先拖动图像时，它们工作得很好，但一旦我尝试拖动文本，图像就不再显示(尽管droppable确实确认图像被拖动到那里)。
下面是我的droppable代码，虽然我不确定问题是由html中的某些东西引起的，还是由这个引起的(注意:上面的'li‘是droppable)：
drop: function(event,ui) {
if (ui.draggable.find("img").length) {
$(this)
.addClass("ui-state-highlight");
$("img", this).attr("src", ui.draggable.find("img").attr("src"));
} else {
$(this)
.addClass("ui-state-highlight")
.text(ui.draggable.text());
}
}如有任何建议，我们将不胜感激。谢谢!
回答 2
Stack Overflow用户
回答已采纳
发布于 2011-07-21 02:47:56
这是因为你的Javascript代码。在文本拖放时，将<li>标记的.text值设置为拖动的文本，这将覆盖其中的<img>标记。那么，您是否只想让它将文本附加到<li>中的任何内容？
下面对else块所做的更改应该会在图像下方添加一个新段落和包含的文本。显然，您可以随意将段落更改为您想要的任何内容。
} else {
$(this)
.addClass("ui-state-highlight")
.append('<p>' + ui.draggable.text() + '</p>');
}Stack Overflow用户
发布于 2011-07-21 02:47:38
$(this).text(...);将替换li的内容。相反，可以使用append将其添加到现有内容中。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/6766859
复制相关文章
相似问题
腾讯云开发者
