jquery可拖动div中嵌套跨度的z-index答案

【问题标题】：z-index of nested span within jquery draggable divjquery可拖动div中嵌套跨度的z-index
【发布时间】：2013-05-13 13:29:29
【问题描述】：

我有一个可拖动的 div 并嵌套在该 div 中我有另一个可调整大小的 div。

div 是动态创建的。

为了让事情稍微复杂一些，我在可调整大小的 div 中设置了一个跨度，其中包含一些文本。

我的问题是，我希望文本可以突出显示，但父 div 的可拖动元素不允许这样做。

如果我将跨度更改为文本区域，一切都很好，但文本区域无法满足我的需求。

我尝试将 span 的 z-index 设置为高于 div 的 (z-index:2000;) 但不高兴，draggale 元素仍然在最前面。

有什么想法吗？

这是我的 div

var newdiv = document.createElement('div');
newdiv.setAttribute('id', id);
newdiv.setAttribute('class', 'dragbox');
newdiv.setAttribute('iterate',i);   
newdiv.style.position = "absolute";
newdiv.style.top = top+"px";
newdiv.style.left = left+"px";
newdiv.style.cursor='move';
newdiv.style.zIndex=zindex;
newdiv.innerHTML = "<br><div id='div"+i +"' style='zindex:1;'><span id='span"+i+"' style='z-index:2000;'>"+content+"</span></div></div>";

【问题讨论】：

听起来你需要stopPropagation()span中的点击事件。你有一个 jsfiddle 中的工作示例吗？
尝试给
当我点击一个名为“编辑文本”的按钮时，我已经有了一个 stopPropagation()，我正在尝试为 span 的内容制作一个简单的富文本编辑器。不幸的是，我无法将 jsfiddle 放在一起，因为页面是使用 php 从 mySQL db 动态构建的
您是否尝试过在您的跨度上使用position: absolute;？当单独的 z-index 不能时，它有时可以与 z-index 结合使用。
@Calvin z-index 本身根本不起作用。它需要定位，这是必须的。

标签： javascript jquery css z-index draggable

【解决方案1】：

抱歉，如果我误解了，但您试图为 div 提供比其父 div 更高的 z-index？，如果这样就行不通了。

正如我在您的代码中看到的那样，z-index:2000 位于 z-index:1 内，因此对于浏览器来说确实只是 z-index:1

编辑

你试过了吗

event.preventDefault();

在 mousedown mousemove 和 mouseup 事件中？

【讨论】：

好的，谢谢，这是我第一次尝试获取 span 的内容，可编辑。您对如何使内部跨度可编辑有任何想法吗？当我使用 var spanclick=document.getElementById('span'+i); 单击跨度的内容时，我可以获得一个警报。 spanclick.onclick=function(e){ alert("hello world"); } 但无法突出显示内容