Javascript 如果我使用<；输入>；

有两张正面和背面的卡片。但在卡二回，不起作用。因为我一直在点击动画作品

需要停止动画的功能，如果我在卡2中使用输入字符串？但如果我使用卡片而不是输入字符串，则可以工作！ Thx所有帮助者=）

$（'.card'）。单击（函数（）{
$（this.toggleClass（'flipped'）；
});
input.form，
钮扣{
字体系列：“Roboto Slab”，衬线；
字体大小：300；
字体大小：16px；
边界：0；
填充物：3px 5px；
边界半径：3px；
颜色：#000；
}
.动画{
-webkit过渡：所有0.3秒轻松；
-moz转换：所有0.3秒轻松；
-ms转换：所有0.3秒轻松；
-o-过渡：所有0.3秒的速度；
过渡：所有0.3秒缓解；
}
.卡片容器{
位置：相对位置；
浮动：左；
宽度：48%；
高度：260px；
利润率：30px 0 30px 4%；
背景：#fff；
/*设置元素的深度*/
-webkit透视图：800px；
-moz透视图：800px；
-透视图：800px；
透视图：800px；
}
.卡容器：第一个孩子{
左边距：0；
}
.卡片{
宽度：100%；
身高：100%；
位置：绝对位置；
光标：指针；
/*设置过渡效果*/
-webkit转换：-webkit转换0.4s；
-moz变换：-moz变换0.4s；
-o-转变：-o-转变0.4s；
转变：转变0.4s；
-webkit变换样式：保留-3d；
-moz变换样式：preserve-3d；
-o变换样式：preserve-3d；
变换样式：保留-3d；
}
.翻了{
-webkit变换：旋转（180度）；
-莫兹变换：旋转（180度）；
-o变换：旋转（180度）；
变换：旋转（180度）；
}
.卡.正面，
.卡，回来{
显示：块；
身高：100%；
宽度：100%；
线高：260px；
颜色：白色；
文本对齐：居中；
位置：绝对位置；
-webkit背面可见性：隐藏；
-moz背面可见性：隐藏；
-o-背面-可见性：隐藏；
背面可见性：隐藏；
盒影：3px 5px 20px 2px rgba（0,0,0,0.25）；
}
.卡，回来{
宽度：100%；
左：3%；
右：3%；
字体大小：16px；
文本对齐：左对齐；
线高：25px；
}
.formItem：第一个孩子{
边缘顶部：20px；
}
.卡片.背面标签{
显示：内联块；
宽度：70px；
文本对齐：左对齐；
}
.名片.正面{
背景：#000000；
}
.卡，回来{
背景#8bc34a；
-webkit变换：旋转（180度）；
-莫兹变换：旋转（180度）；
-o变换：旋转（180度）；
变换：旋转（180度）；
}
.卡片容器：第一个子.卡片.前面{
背景：#000000；
}
.card容器：第一个子项.card.back{
背景#8bc34a；
}
.cardTitle{
字号：1.4em；
线高：1.2米；
保证金：0；
}
.内容{
填充：4%；
字号：100；
文本对齐：左对齐；
}
button.btn发送{
显示：内联块；
最小宽度：100px；
填充物：3px 5px；
边缘顶部：10px；
字体大小：粗体；
文本转换：大写；
文本对齐：居中；
颜色：#8bc34a；
背景：#fff；
边界：0；
边界半径：0；
}

关于
美好的

请阅读本文。

这个问题
联系我们！
发邮件！

我们等待你的来信。

姓名：
电邮：
发送
1. 一种可能的解决方案是检查卡中是否有聚焦元素：

$('.card').click(function() {
  $(this).not(':has(:focus)').toggleClass('flipped');
});


$（'.card'）。单击（函数（）{
$（this）.not（“：has（：focus）”）.toggleClass（'fliped'）；
});
input.form，
钮扣{
字体系列：“Roboto Slab”，衬线；
字体大小：300；
字体大小：16px；
边界：0；
填充物：3px 5px；
边界半径：3px；
颜色：#000；
}
.动画{
-webkit过渡：所有0.3秒轻松；
-moz转换：所有0.3秒轻松；
-ms转换：所有0.3秒轻松；
-o-过渡：所有0.3秒的速度；
过渡：所有0.3秒