首次成功触发后，JS .html() 通知窗口消失

Question

我的JS代码有问题，请检查一下并建议可能出现的问题。

在我的 html 页面中，我有一个"div"作为<div id="notification"></div> 这个"div"是我想显示不同类型的通知的地方，这些通知可能在PHP代码成功执行后（例如，保存在"myphppage.php"中）。

<div class="cycle">
  <input value="Add to Cart" onclick="addToCart('828');" class="button" type="button">
</div>

这是在点击按钮后触发的javascript：

function addToCart(quantity) {
 $.ajax({
   url: 'myphppage.php',
   type: 'post',
   data: '&quantity=' + quantity,
   dataType: 'html',
   success: function(html) {
     if (html == 'success') {
       $('#notification').html('Success: Book added in your cart.' + '<img src="/img/close.png" class="close" />').show();
       $('#notification').addClass('success');
       $('.success').fadeIn('slow');
     }
   }
 })
}

在php代码回显"成功"后，#notification 在网页中正确显示，但在随后点击"添加到购物车"按钮时，尽管php代码在后台成功执行并且php代码回显"成功"，但 #notification 没有显示任何内容。

作为一种解决方法，如果我刷新网页，那么它会再次工作一次，然后从下次开始它就会消失。

Answer 1

隐藏#notification后，必须有一个内联 css display: none;。然后下次当你使用.show()它就不起作用了。
尝试删除.show()，因为它与.fadeIn()执行相同的操作。