我是jquery的新手。我有一个表单，它执行计算，并以闪烁消息的形式返回结果。我的目标行为是：
- 第一次提交表单时，包含结果的flash消息会逐渐消失
- 在随后的提交中，包含旧结果的flash消息将淡出，然后新的flash消息会淡入
我很困惑如何做到这一点，因为很明显，旧的和新的结果都有相同的id。
目前只有淡入正在工作。
jquery:
$(function() {
$(".btn-primary").click(function() {
$("#diagnosis").fadeOut("slow");
});
$('#diagnosis').delay(0).fadeIn('normal', function() {
$(this).delay(2500);
});
});
CSS
#diagnosis { display:none; }
您可以在Jquery中链接fadeIn和fadeOut动画。请注意，您也可以将一个完整的函数传递给任一动画，例如$('#result').fadeOut('fast', () => {})。这确保了我们只在结果完全消失时更新结果，然后新结果将立即随着更新的值而消失。点击此处查看更多参考资料。
let arr = [4, 5, 6, 7, 8, 9, 10]
$('form').on("submit", (e) => {
e.preventDefault();
// mock calculated result
let genIdx = Math.floor(Math.random() * 7);
let resultVal = arr[genIdx];
$('#result').fadeOut('fast', () => {
$('#result').text(resultVal);
}).fadeIn('fast');
})<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<html>
<body>
<form>
<p id="result"></p>
<button type="subimit">Submit</button>
</form>
</body>
</html>