Javascript HTML字幕在fadeIn（）之后不起作用

我正在尝试用html字幕制作进度条。当用户单击submit，

fadeIn

HTML框并使用ajax成功淡出。但是，当我单击提交按钮时，字幕将

fadeIn

并且不起作用。以下是我的尝试：-

$（文档）.ready（函数（）{
$（“#注册提交”）。单击（函数（）{
$（'.bar'）.fadeIn（）；
})
})

.bar{
背景：#a0；
边框左上半径：8px；
边框右上角半径：8px；
显示：无；
}
.进展{
宽度：50px；
高度：4px；
背景：橙色；
显示：块；
}

---

我认为这是因为

显示：无

字幕不起作用，而是使用设置

不透明度：0

和

高度：0px

，请参考下面演示方法的片段

请使用相同的方法隐藏选框元素

$（文档）.ready（函数（）{
$（“#注册提交”）。单击（函数（）{
$（'.bar'）.addClass（“隐藏”）；
})
})

.bar{
背景：#a0；
边框左上半径：8px；
边框右上角半径：8px；
不透明度：0；
高度：0px；
过渡：不透明度1s；
溢出：隐藏；
}
.bar.隐藏{
不透明度：1；
高度：自动；
}
.进展{
宽度：50px；
高度：4px；
背景：橙色；
显示：块；
}

---

我认为这是因为

显示：无

字幕不起作用，而是使用设置

不透明度：0

和

高度：0px

，请参考下面演示方法的片段

请使用相同的方法隐藏选框元素

$（文档）.ready（函数（）{
$（“#注册提交”）。单击（函数（）{
$（'.bar'）.addClass（“隐藏”）；
})
})

.bar{
背景：#a0；
边框左上半径：8px；
边框右上角半径：8px；
不透明度：0；
高度：0px；
过渡：不透明度1s；
溢出：隐藏；
}
.bar.隐藏{
不透明度：1；
高度：自动；
}
.进展{
宽度：50px；
高度：4px；
背景：橙色；
显示：块；
}

为什么要为此使用

？我们现在有了一个非常好的

元素。@AuxTaco但是HTML5在

中不起作用，为什么要用
呢？我们现在有一个非常好的
元素。@AuxTaco但是HTML5在
中不工作