Javascript 多卡翻转jQuery

我希望有多张卡片分别翻转，但我对jQuery/JS不是很精通，我在理解代码方面遇到了问题，需要一些帮助。此外，单击时瓷砖不会翻转

$（'.js click'）。在（'click'，function（）上{
$（'.card'）.not（this.removeClass（'fliped'）；
$（'.card'）.toggleClass（'flipped'）；
});
$（'.js-click1'）。在（'click'，function（）上{
$（'.card'）.not（this.removeClass（'fliped'）；
$（'.card'）.toggleClass（'flipped'）；
});
.flipContainer{
宽度：260px；
高度：200px；
位置：相对位置；
-webkit透视图：800px；
-moz透视图：800px；
-透视图：800px；
透视图：800px；
}
.卡片{
宽度：100%；
身高：100%；
位置：绝对位置；
-webkit转换：-webkit转换1s；
-moz变换：moz变换1s；
-o-转变：-o-转变1s；
转变：转变1s；
-webkit变换样式：保留-3d；
-moz变换样式：preserve-3d；
-o变换样式：preserve-3d；
变换样式：保留-3d；
-webkit转换来源：50%50%；
}
.信用卡部{
显示：块；
身高：100%；
宽度：100%；
线高：200px；
颜色：白色；
文本对齐：居中；
字体大小：粗体；
字体大小：12px；
位置：绝对位置；
-webkit背面可见性：隐藏；
-moz背面可见性：隐藏；
-o-背面-可见性：隐藏；
背面可见性：隐藏；
}
.名片.正面{
背景：红色；
}
.卡，回来{
背景：蓝色；
-webkit变换：旋转（180度）；
-莫兹变换：旋转（180度）；
-o变换：旋转（180度）；
变换：旋转（180度）；
}
.翻了{
-webkit变换：旋转（180度）；
-莫兹变换：旋转（180度）；
-o变换：旋转（180度）；
变换：旋转（180度）；
}

+
定制安装
自定义安装详细信息
+
定制安装
自定义安装详细信息
您正在使用
.card
在所有元素上切换
翻转的
类，您需要它为相关元素（如

$(this).closest('.card').toggleClass('flipped');

此外，您可以通过将
js click
class分配给两个按钮来减少代码

这是一个片段


$（'.js click'）。在（'click'，function（）上{
$（此）.closest（'.card'）.toggleClass（'flipped'）；
});
.flipContainer{
宽度：260px；
高度：200px；
位置：相对位置；
-webkit透视图：800px；
-moz透视图：800px；
-透视图：800px；
透视图：800px；
}
.卡片{
宽度：100%；
身高：100%；
位置：绝对位置；
-webkit转换：-webkit转换1s；
-moz变换：moz变换1s；
-o-转变：-o-转变1s；
转变：转变1s；
-webkit变换样式：保留-3d；
-moz变换样式：preserve-3d；
-o变换样式：preserve-3d；
变换样式：保留-3d；
-webkit转换来源：50%50%；
}
.信用卡部{
显示：块；
身高：100%；
宽度：100%；
线高：200px；
颜色：白色；
文本对齐：居中；
字体大小：粗体；
字体大小：12px；
位置：绝对位置；
-webkit背面可见性：隐藏；
-moz背面可见性：隐藏；
-o-背面-可见性：隐藏；
背面可见性：隐藏；
}
.名片.正面{
背景：红色；
}
.卡，回来{
背景：蓝色；
-webkit变换：旋转（180度）；
-莫兹变换：旋转（180度）；
-o变换：旋转（180度）；
变换：旋转（180度）；
}
.翻了{
-webkit变换：旋转（180度）；
-莫兹变换：旋转（180度）；
-o变换：旋转（180度）；
变换：旋转（180度）；
}

+
定制安装
自定义安装详细信息
+
定制安装
自定义安装详细信息
您正在使用
.card
在所有元素上切换
翻转的
类，您需要它为相关元素（如

$(this).closest('.card').toggleClass('flipped');

此外，您可以通过将
js click
class分配给两个按钮来减少代码

这是一个片段


$（'.js click'）。在（'click'，function（）上{
$（此）.closest（'.card'）.toggleClass（'flipped'）；
});
.flipContainer{
宽度：260px；
高度：200px；
位置：相对位置；
-webkit透视图：800px；
-moz透视图：800px；
-透视图：800px；
透视图：800px；
}
.卡片{
宽度：100%；
身高：100%；
位置：绝对位置；
-webkit转换：-webkit转换1s；
-moz变换：moz变换1s；
-o-转变：-o-转变1s；
转变：转变1s；
-webkit变换样式：保留-3d；
-moz变换样式：preserve-3d；
-o变换样式：preserve-3d；
变换样式：保留-3d；
-webkit转换来源：50%50%；
}
.信用卡部{
显示：块；
身高：100%；
宽度：100%；
线高：200px；
颜色：白色；
文本对齐：居中；
字体大小：粗体；
字体大小：12px；
位置：绝对位置；
-webkit背面可见性：隐藏；
-moz背面可见性：隐藏；
-o-背面-可见性：隐藏；
背面可见性：隐藏；
}
.名片.正面{
背景：红色；
}
.卡，回来{
背景：蓝色；
-webkit变换：旋转（180度）；
-莫兹变换：旋转（180度）；
-o变换：旋转（180度）；
变换：旋转（180度）；
}
.翻了{
-webkit变换：旋转（180度）；
-莫兹变换：旋转（180度）；
-o变换：旋转（180度）；
变换：旋转（180度）；
}

+
定制安装
自定义安装详细信息
+
定制安装
自定义安装详细信息
首先，您需要将这两张卡都设置为
js click
类，以便您可以使用相同的
$（'.js click'）
选择器来定位这两张卡。然后，当您想要翻转目标的
.card
时，您所要做的就是在上切换类
翻转的

这可以从以下几点看出：


$（'.js click'）。在（'click'，functi