javascript - Jquery 中的 Div 位置

Question

我想知道Client div的位置

    var p = $('div#Client');
    var position = p.position();
    $('div#Client').fadeTo('slow',.6);
    $('div#Client').append('<div style="position: absolute;top:' + position.top + ';
    left:' + position.left + ';width: 100%;height:100%;z-index:2;opacity:0.4;
    filter: alpha(opacity = 50)"></div>');

结果是:

Position.left = 0 and Top = 0

所以Jquery代码中新建的Div在所有页面上

我需要的是将新的 div 放在 div#Client

之上

HTML代码:

<div style="margin-left: 10px; margin-bottom: 10px; padding-bottom: 15px">
   <div class="Title">Sales</div>
      <div id="Sales" class="Content">
         Some infos for Sales person here
      </div>
   </div>
</div>


<div style="margin-left: 10px; margin-bottom: 10px; padding-bottom: 15px">
   <div class="Title">Client</div>
      <div id="Client" class="Content">
         Some infos for the client here
      </div>
   </div>
</div>

这是:http://jsfiddle.net/aaNUa/14/

实际上，我想做的是阻止 Div Client，但保持 Div Sales 处于激活状态以进行编辑。使用此代码，所有页面都被阻止。

Answer 1

在 Jquery 中使用 before() 方法:

$(document).ready(function(){
 $("div#Client").before('<div class="Title">Client</div>');
});

fiddle :http://jsfiddle.net/aaNUa/

HTML 代码:

<div style="margin-left: 10px; margin-bottom: 10px; padding-bottom: 15px">
   <div class="Title">Sales</div>
      <div id="Sales" class="Content">
         Some infos for Sales person here
      </div>
   </div>
</div>


<div style="margin-left: 10px; margin-bottom: 10px; padding-bottom: 15px">

      <div id="Client" class="Content">
         Some infos for the client here
      </div>
   </div>
</div>