Javascript 使用jQuery在页面重定向后显示DIV

我有一个

div

，当

document

准备好时，它被设置为

hide（）

。我希望在包含的div可见时显示此div。我还有一个接受用户输入的表单。表单被重定向到其页面，

action=”“

。submit有一个类

。submitRecord

。成功地将记录提交给数据库后，包含的div将变为可见

PHP代码：

if (isset($_POST['submitRecord']) && $success != ''){
    echo "<div class='containingDiv'>";
       echo "<div class='alloc'>";
         echo "<p class = 'closeButton'> x </p>";
         echo "<p class = 'allocationSuccess'>Allocation Successful for Mr/Mrs ABC</p>";
       echo "</div>";
    echo "</div>";
    };

$(document).ready(function(){
  $('.containingDiv, .alloc').hide();
  $(document).on('click', '#saveRecord', function () { 
    if ($(".containingDiv").is(':visible')){
        $('.alloc').slideDown(500);
    }
  });
 $(document).on('click', '.closeButton', function () { 
    $('.alloc').hide(500);
  });
});

表单被提交，并且

var

$success

被分配了一个字符串，但是

.alloc

不会显示

---

任何帮助都将不胜感激。

基于您的标题，您使用的是普通表单提交（无ajax）。这意味着事件流类似于：

• 你的按钮被点击
• 您的javascript函数被触发，尝试设置页面上不存在的

  div

  的动画
• 访问者被重定向到表单提交的页面，即使有动画，访问者也不会看到它，因为重定向
• 处理表单并显示新页面（此处未触发javascript onClick事件）
• success

  div

  已添加到页面中，但仍处于隐藏状态

有两种解决方案：

使用ajax提交表单，将所有内容保持在同一页面中，并设置所需的动画

您可以在成功页面上显示成功框，而不是在页面加载时隐藏成功框，并且仅在某个

超时后或单击按钮后才将其隐藏。请注意，您不必在页面加载时隐藏该框，因为它仅在成功提交表单时添加到页面中

---

首先选中this

$（'.alloc'）.show（）

@hellosheikh我不希望在第一个实例中显示它。在设置为隐藏之前，我做得很好。@jeroen：不使用AJAX。它将重新加载页面。我不想用AJAX来解决这个问题。如果没有AJAX，我如何实现目标？@Yax请看我答案的第二个选项。@jereon:谢谢，但是如果我在

timeOut

上显示并隐藏它，它将如何解决我的问题？@Yax它将仅在成功提交表单时显示您的成功消息，并在一段时间后自动隐藏它。但你也可以按你的按钮。