Javascript 移动父popin时对child输入的传播问题

我给一个popin添加了一些代码，使其在屏幕上可以移动，但我的问题是当我点击这个popin中的一个元素（选择、输入文本、文本区域等）时，它会触发代码移动我的popin，我尝试了一些方法来停止传播，但不起作用。也许你有什么想法来帮助我？或者也许移动我的popin的方法不好

对不起，我的英语。。。提前谢谢你 这是我的密码：

var鼠标定位；
var偏移量=[0,0]；
var divpopin=$（“div.sp-body”）；
divpopin=divpopin[0]；
var isDown=假；
divpopin.addEventListener（'mousedown'，函数（e）{
isDown=真；
偏移量=[
divpopin.offsetLeft-e.clientX，
divpopin.offsetTop-e.clientY
];
}，对）；
document.addEventListener（'mouseup'，function（）{
isDown=假；
}，对）；
document.addEventListener（'mousemove'，函数（事件）{
event.preventDefault（）；
如果（isDown）{
鼠标位置={
x:event.clientX，
y:event.clientY
};
divpopin.style.left=（mousePosition.x+偏移量[0]）+'px'；
divpopin.style.top=（mousePosition.y+偏移量[1]）+'px'；
}
}，对）
.smart-popin
{
位置：固定；
左：0；右：0；
顶部：0；底部：0；
溢出：自动；
背景色：rgba（0,0,0,0.5）；
-webkit过渡：所有0.4s易用性；
-moz过渡：所有0.4s易用性；
-ms过渡：所有0.4s缓解；
-o型过渡：所有0.4s缓解；
过渡：所有0.4s缓解；
z指数：5；
}
.smart popin.sp表
{
显示：表格；
身高：100%；
宽度：100%；
}
.smart popin.sp电池
{
显示：表格单元格；
垂直对齐：中间对齐；
填充：10px；
}
.smart popin.sp body
{
位置：相对位置；
z指数：5；
宽度：自动；
保证金：0自动；
背景色：#ffffff；
填料：2米；
-网络工具包盒阴影：0 3px 5px 1px rgba（0,0,0,0.25）；
盒影：0 3px 5px 1px rgba（0,0,0,0.25）；
/*宽度：50%*/
宽度：1024px；
}
.smart popin.sp body*
{
最大宽度：100%；
}
.smart popin.sp back{
位置：固定；
左：0；右：0；
顶部：0；底部：0；
}
.smart popin.sp关闭{
位置：绝对位置；
排名：0；
右：0；
宽度：36px；
高度：36px；
文本对齐：居中；
线高：36px；
字号：1.6em；
颜色：#000000；
字号：900；
文字装饰：无；
}

事件
活动
布拉布拉
资源
布拉布拉
就业协会
评论




首先：您的后退按钮“覆盖”了所有内容，并且始终是单击的元素。由于它没有函数，我在示例中删除了它，以回答如何区分允许的元素和其他类似输入的问题

如果单击的元素是div或h2，则可以使用if（$（e.target）.is（'div，h2'））

限制mousedown处理程序（这只是一个示例，您还可以允许使用标签等）

顺便说一下，您应该将div.sp-body的位置更改为

position:fixed

，因为相对时它是“跳开的”。此外：与使用jQuery定义divpopin，然后使用

[0]

选择DOM对象不同，您可以直接使用普通javascript来定义它：

var divpopin=document.querySelector（“div.sp-body”）

工作示例：

var鼠标定位；
var偏移量=[0,0]；
var divpopin=document.querySelector（“div.sp-body”）；
var isDown=假；
divpopin.addEventListener（'mousedown'，函数（e）{
如果（$（e.target）.is（'div，h2'））{
isDown=真；
偏移量=[
divpopin.offsetLeft-e.clientX，
divpopin.offsetTop-e.clientY
];
}
}，对）；
document.addEventListener（'mouseup'，function（）{
isDown=假；
}，对）；
document.addEventListener（'mousemove'，函数（事件）{
event.preventDefault（）；
如果（isDown）{
鼠标位置={
x:event.clientX，
y:event.clientY
};
divpopin.style.left=（mousePosition.x+偏移量[0]）+'px'；
divpopin.style.top=（mousePosition.y+偏移量[1]）+'px'；
}
}，对）
.smart-popin{
位置：固定；
左：0；
右：0；
顶部：