Javascript 为什么jQuery会删除父项<；部门>-通过插入新的元素<；部门>-使用jQuery的元素？

在与Django合作的项目中，我的前端遇到了问题

我制作了这个非常简单的引导网格，并用jQuery插入了这些黄色块，这些块应该是可拖动和可调整大小的（使用jQuery UI小部件）

我的jQuery代码（可能有点凌乱；）：

以及模板中的相关html：

<div class="container-fluid">
   <h1 style="padding: 5px"> Arbeitsplanner: </h1>
    <div class="row">
      <div class="col-lg-2" style="border: double" > 
      <!--....some other grid content....-->
       </div>

      <!-- Main planner-table wrapper (right):-->
      <div class="col-lg-10" style="border: double">
           <!-- Header dates:-->
        <div style="background-color: grey; border: double"                                                                                                      id="mainContentWrapper" class="row">
        {% for columnDate in viewedDateColumns %}
        <div style="width: 20%; border: double" class="col-lg-2"><strong>{{columnDate}}</strong></div> 
        {%endfor%}
       </div>
          <!-- Main planner - main columnview: -->
      {% for employer in employers %}
       <div class="row employerMainRow" style="min-height: 45px; border: double; background-color: transparent; padding-right: 0px">

       </div>
       {%endfor%} 


          </div>
       </div>
    </div>

仲裁程序：
{viewedDateColumns%中columnDate的百分比为%}
{{columnDate}}
{%endfor%}
{雇主中雇主的百分比%}
{%endfor%}

我通过jQuery阻止了黄色div可以在垂直方向上调整大小（通过句柄）。这是可行的，你不能在那个方向调整它的大小。但现在鼠标在黄色div的下角悬停时，不断显示调整大小的鼠标指针。使用这种方法的真正奇怪的效果是，通过尝试在垂直方向调整大小，我创建的引导网格中的一行就消失了。这一行的黄色div移到另一行

我只是不明白为什么会发生这种情况，并尝试使用jQueryUI提供的属性做了一些事情，但没有任何改变

我的代码中是否有一些根本错误的地方导致了这种情况的发生？有什么可以预防的吗

希望问题/想法清楚。（我想提供一个演示站点，但对于django，这有点棘手，当它仍然在线时，也许：）

编辑：我想我可以把基本问题缩小一点。在使用jQuery代码运行模板时，我发现jQuery UI只是通过加载页面本身从一开始就删除了创建的行div。（尚未涉及调整大小）。请注意，我必须将黄色的eventCol放入这些“row”元素中，因此根据使用jQuery插入内容的位置，父元素似乎会被完全删除

---

这有一般的原因吗

我尝试了演示链接，我认为这就是问题所在。一旦开始调整第一个块的大小，其起始位置将重置为显示时的初始位置。如果您可以在调整大小操作之前捕获div的当前位置，并将其添加到css的resize函数中，那么应该可以解决您的问题。对于顶部div，只要开始调整大小，属性

left

就被设置为零。另一个div没有出现这种情况。请将顶部div的颜色更改为红色，然后查看。@RaghuramKasyap谢谢您的评论。请具体说明“显示器初始位置”的含义。问题是这些都是嵌套的div，所以就这一个而言；父对象内部的位置与父对象以外的任何对象都不相关。所以位置只是由marginleft属性定义的。因此，根据特定行的情况，黄色div将受到影响。对于顶部div，只要开始调整大小，属性left就会设置为零。这不是发生在另一个部门。

<div class="container-fluid">
   <h1 style="padding: 5px"> Arbeitsplanner: </h1>
    <div class="row">
      <div class="col-lg-2" style="border: double" > 
      <!--....some other grid content....-->
       </div>

      <!-- Main planner-table wrapper (right):-->
      <div class="col-lg-10" style="border: double">
           <!-- Header dates:-->
        <div style="background-color: grey; border: double"                                                                                                      id="mainContentWrapper" class="row">
        {% for columnDate in viewedDateColumns %}
        <div style="width: 20%; border: double" class="col-lg-2"><strong>{{columnDate}}</strong></div> 
        {%endfor%}
       </div>
          <!-- Main planner - main columnview: -->
      {% for employer in employers %}
       <div class="row employerMainRow" style="min-height: 45px; border: double; background-color: transparent; padding-right: 0px">

       </div>
       {%endfor%} 


          </div>
       </div>
    </div>