jquery - 如何让div元素消失

Question

我正在学习 Rails，并且正在使用 Rails Web 应用程序。它有一个“订购”按钮，当我单击它时，它会显示:“感谢您订购”。这是使用闪光 Action 完成的。我希望该消息在 5 秒后消失。我添加了这段代码:

$(document).ready(function() {
    $("#notice").fadeOut("slow");
});

该脚本位于views/layout 文件夹内，并链接到同一文件夹内的application.html.erb 文件。但是，它不起作用。我做错了什么以及如何解决它？

Answer 1

你必须做几件事才能实现这一目标。这就是我要做的。

1. 添加div与 id并将其隐藏。

   <div id="notice" style="display: none"> Thank you for your ordering </div>

2. 添加脚本。

   $(document).ready(function note() {
       $("#notice").fadeIn().delay(5000).fadeOut();
   });
   

3. 添加onclick函数为 .erb文件。

   <%= link_to "Order", order_path, :onclick=>'function note()' %>

希望对您有所帮助。

附注您还可以跳过步骤 2 并将脚本直接添加到 .erb 文件中。

<%=
  link_to "Order", order_path, :onclick=>'$("#notice").fadeIn().delay(5000).fadeOut();'
%>