Javascript 使div可移动但不可移动其子元素

我想让一个div可以移动。div有子div元素。您可以在这里查看JSFIDLE：

我只希望容器（最外面的div）是可移动的。当前，内部文本在没有外部div的情况下是可移动的。最外层的容器div应始终与其余子元素一起移动

    <div id="id">
           <div>second div</div>
           <div>third element</div>
   </div>

$(document).ready(function() {
    var $dragging = null;

    $(document.body).on("mousemove", function(e) {
        if ($dragging) {
            $dragging.offset({
                top: e.pageY,
                left: e.pageX
            });
        }
    });

    $('#id').on("mousedown", null , function (e) {
        $dragging = $(e.target);
    });

    $(document.body).on("mouseup", function (e) {
        $dragging = null;
    });
});

第二组
第三要素
$（文档）.ready（函数（）{
var$draging=null；
$（document.body）.on（“mousemove”，函数（e）{
如果（$拖动）{
$s.offset({
上图：e.pageY，
左：e.pageX
});
}
});
$（'#id'）。on（“mousedown”，null，函数（e）{
$dragging=$（e.target）；
});
$（document.body）.on（“mouseup”，函数（e）{
$draging=null；
});
});

只需在拖动开始处检查它实际上是父div：

---

正如Arun p Johny指出的，$（this）之后将给出JQuery目标，而不是鼠标目标。这意味着

$dragging=$（这）

更整洁、更简单。

只需在拖动开始处检查它实际上是父div：

---

正如Arun p Johny指出的，$（this）之后将给出JQuery目标，而不是鼠标目标。这意味着

$dragging=$（这）

更整洁、更简单。

问题在于行

$dragging=$（e.target），而不是使用
$dragging=$（此选项）

演示：
问题在于行
$dragging=$（e.target），而不是使用
$dragging=$（此选项）

演示：
由于内部div属于外部div，因此它们将始终随外部div一起移动。。。除非您将它们从div内部移除并放置在div外部…我也想移动内部子元素，但不能不移动外部主div。将编辑问题以澄清这一点。@devnull69：如果它们绝对定位，则不会。我需要澄清：即使您同时定位了内部div和外部div绝对，内部div将相对于外部div放置。因此，如果移动外部div，内部div将随之移动。请参见简单示例：并更改外部divOh god的上/左属性。。。我现在看到OP已经改变了描述。实际上，他希望内部div和外部div一起移动，但不是单独移动…因为内部div属于外部div，所以它们将始终与外部div一起移动。。。除非您将它们从div内部移除并放置在div外部…我也想移动内部子元素，但不能不移动外部主div。将编辑问题以澄清这一点。@devnull69：如果它们绝对定位，则不会。我需要澄清：即使您同时定位了内部div和外部div绝对，内部div将相对于外部div放置。因此，如果移动外部div，内部div将随之移动。请参见简单示例：并更改外部divOh god的上/左属性。。。我现在看到OP已经改变了描述。实际上，他想让内部的div和外部的div一起移动，但不是靠它们自己移动……这是一个非常好的解决方案。本来会接受的，但Truebluaussie是第一个。我希望你不介意。+1：你的解决方案更优雅。我应该自己考虑。@TrueBlueAussie您甚至可以使用
e.currentTarget
非常简洁的解决方案。本来会接受的，但Truebluaussie是第一个。我希望你不介意。+1：你的解决方案更优雅。我应该自己考虑过。@TrueBlueAussie您甚至可以使用
e.currentTarget
是的，但是
$dragging=$（这个）
更好。把它交给Arun P Johny。相反，看看你是否觉得这个旧答案值得更多的选票：：）是的，但是
$dragging=$（这个）
更好。把它交给阿伦·P·约翰尼。相反，看看你是否觉得这个老答案值得投更多的票：）
$('#id').on("mousedown", null , function (e) {
    if ($('#id').is(e.target))
    {
        $dragging = $(e.target);
    }
});

$(document).ready(function () {
    var $dragging = null;

    $(document.body).on("mousemove", function (e) {
        if ($dragging) {
            $dragging.offset({
                top: e.pageY,
                left: e.pageX
            });
        }
    });

    $('#id').on("mousedown", null, function (e) {
        $dragging = $(this);
    });

    $(document.body).on("mouseup", function (e) {
        $dragging = null;
    });
});