Javascript jQuery.remove()快疯了

Javascript jQuery.remove()快疯了,javascript,jquery,Javascript,Jquery,我使用jQuery创建了一个简单的滑块,没有其他插件 动画可以工作,但是当移除第一张幻灯片(要在结尾移动它)时,.remove()意外地移除所有幻灯片 这是代码(代码片段显示了确切的问题): $(文档).ready(函数() { var AnimateGallery=函数(项) { $(项)。动画({left:::-=1},20,'线性',函数() { //我试着调试,测试$(item)是否捕获了所有幻灯片, //但事实并非如此。 $(item).attr(“数据关闭,$(item).offs

我使用jQuery创建了一个简单的滑块,没有其他插件

动画可以工作,但是当移除第一张幻灯片(要在结尾移动它)时,
.remove()
意外地移除所有幻灯片

这是代码(代码片段显示了确切的问题):

$(文档).ready(函数()
{
var AnimateGallery=函数(项)
{
$(项)。动画({left:::-=1},20,'线性',函数()
{
//我试着调试,测试$(item)是否捕获了所有幻灯片,
//但事实并非如此。
$(item).attr(“数据关闭,$(item).offset().left+$(item).width());
$(项).attr(“数据输出”,布尔值($(项).offset().left+$(项).width()<100.toString());
if(parseFloat($(item).attr(“数据关闭”))<0)
{
$(项).remove();
//^^^^^当第一张幻灯片满足条件时,此幻灯片意外删除所有幻灯片
}
其他的
动画库($(项目));
});
};
$(“.mp画廊”)
.find(“.mp库项”)
.each(函数(
{
var$el=$(本);
动画师($el);
});
});
div.mp-gallery
{
位置:相对位置;
排名前10%;
左:0;
边框:1px纯黑;
背景色:#333;
身高:40%;
宽度:100%;
字号:0;
盒影:0 20px黑色;
空白:nowrap;
}
div.mp-gallery-item
{
显示:内联块;
宽度:计算值(100%/3);
保证金:0;
填充:0;
垂直对齐:中间对齐;
字号:12号;
位置:相对位置;
}
div.mp-gallery-item
{
高度:100px;
}
div.mp-gallery-item-image
{
光标:指针;
身高:100%;
}
div.mp-gallery-item-text
{
填充:2%;
垂直对齐:中间对齐;
文本对齐:居中;
位置:相对位置;
前-50%;
背景色:rgba(0,0,0,0.2);
不透明度:1;
颜色:白色;
}

图文
图文
图文
图文
图文
图文

所有项目同时被删除的原因是项目在其左兄弟项目被删除时向左移动。这会一个接一个地将每个项移过0,从而触发remove方法

一种解决方案是对项目进行绝对定位

$(文档).ready(函数(){
var AnimateGallery=函数(项){
$(项目)。设置动画({
左:“-=1”
},20,'线性',函数(){
$(item).attr(“数据关闭,$(item).offset().left+$(item).width());
$(项).attr(“数据输出”,布尔值($(项).offset().left+$(项).width()<100.toString());
if(parseFloat($(item).attr(“数据关闭”))<0){
$(项).remove();
}否则
动画库($(项目));
});
};
$(“.mp画廊”)
.find(“.mp库项”)
.每个(功能(索引){
var$el=$(本);
$el.css(“left”,$el.width()*索引);/*添加了这个*/
动画师($el);
});
});
div.mp-gallery{
位置:相对位置;
排名前10%;
左:0;
边框:1px纯黑;
背景色:#333;
身高:40%;
宽度:100%;
字号:0;
盒影:0 20px黑色;
空白:nowrap;
}
div.mp-gallery-item{
显示:内联块;
宽度:计算值(100%/3);
保证金:0;
填充:0;
垂直对齐:中间对齐;
字号:12号;
位置:绝对;/*更改了此位置*/
}
div.mp-gallery-item{
高度:100px;
}
div.mp-gallery-item-image{
光标:指针;
身高:100%;
}
div.mp-gallery-item-text{
填充:2%;
垂直对齐:中间对齐;
文本对齐:居中;
位置:相对位置;
前-50%;
背景色:rgba(0,0,0,0.2);
不透明度:1;
颜色:白色;
}

图文
图文
图文
图文
图文
图文

听起来好像所有元素的
数据关闭
都是
<0
。您是否进行过任何调试以找出原因?我很确定,通过删除它,您将推送其他元素,从而触发它们也被删除
$(项)
是单个元素,
数据off
对于控制台窗口中测试的所有元素都不是0@AndrewBrooke我不知道为什么会发生这种情况,也找不到解决方案…看看这把小提琴,通过将项目设置为隐藏而不是删除它,它不会删除其他项目我不知道如何解决这个问题,但通过这样做,大量的元素将被创建并立即设置动画…我同意@Fraser Crosbie,但你不应该移除幻灯片,只需将其重置为左侧设置即可