Jquery insertBefore问题

时间:2012-09-14 02:21:28

标签: jquery

我在这里完成插入元素任务时遇到了麻烦,我花了好几个小时。

当用户点击按钮时,我尝试按类名插入元素。我也在脚本中设置了css。我的问题是只有第一个元素有css属性而不是其余元素。任何人都可以帮我吗?非常感谢!

Jquery的

  //when users clicks the button

   var imgForClass = $("<img src='images/anim.gif' class='imgAbs'>");

   var cssProp = {'position':'absolute',
                       'z-index':99,
                       'top': topPos,  //topPos is the position that the element I want to attach to.
                       'left': leftPos //leftPos is the position that the element I want to attach to.
            }

   //detect if the element has id of 'cons'
   if($element.is('#cons'){                
               imgForClass.insertBefore('.conElement');
               imgForClass.css(cssProp) 
    }

HTML

<div>
<img src='a.jpg'/>
<img id='cons' src='b.jpg'/>
</div>      

//the new element will be inserted here but only the first element has css property(z-index...etc)
<div class='conElement'>
<img src='b.jpg'/>
</div>      

//the new element will be inserted here but has no css property(z-index...etc)
<div class='conElement'>
<img src='b.jpg'/>
</div>      

//the new element will be inserted here but has no css property(z-index...etc)
<div class='conElement'>
<img src='b.jpg'/>
</div>      

//the new element will be inserted here but has no css property(z-index...etc)
<div class='conElement'>
<img src='b.jpg'/>
</div>   


...more <div>         

2 个答案:

答案 0 :(得分:1)

我认为这里的问题是你期望在insertBefore()方法调用之后imgForClass变量现在是对所有新插入的img标记的引用,我相信它只是持有对第一个的引用。所以也许以下内容可以帮助你

if($element.is('#cons'){                
               imgForClass.insertBefore('.conElement');
               $('.imgAbs').css(cssProp);
} 

在旁注中,在页面上使用与所有

相同的ID的多个元素是不太好的做法
<img id='cons' src='b.jpg'/>

答案 1 :(得分:0)

我认为这样做:

if($element.is('#cons'){                
    imgForClass.insertBefore('.conElement').css(cssProp);
}