Javascript 如何在表单提交后隐藏Div元素

我要快点。我在一个网站上工作，它接受一个id号，查询数据库，然后在一个漂亮的表中返回同一页面上的数据。我遇到了一个奇怪的问题，

输入

框（表单的一部分）不会消失。以下是与此相关的代码：

表格：

php

脚本中的

echo

'd函数：

<script type='text/javascript'>
                        function SwapDivsWithClick()
                            {
                             $( 'div' ).remove( '.search_box' );        
                            }
                </script>"

函数SwapDivsWithClick（）
{
$（'div'）。删除（'search_框'）；
}
"

这就是我在经历了一长串的尝试和错误之后目前正在尝试的。我认为问题在于，当用户提交表单时，php脚本执行的速度比页面重新加载的速度快，因此当它重新加载时，它继承了附加的

.css

样式表中的样式。我有什么想法可以让它工作吗

注意：我已经尝试用必要的信息替换

搜索框

类。同样的情况也在发生

---

谢谢大家！

这里不需要使用JavaScript。只需检查表单是否已提交，并基于此隐藏

div

元素

<div class="search_box" <?php if(isset($_POST['newperson'])){ echo "style='display:none'"; } ?>>    
    <form method="POST" id="search_form">
        <input type="text" name="person_id" class="submission-boxes" placeholder="Person ID" required><br>
        <input type="submit" name="newperson" class="submission-btn" value="+ Add Person" id="find_em">
    </form>
</div>

---

您只需添加一个onsubmit函数，该函数将在提交表单时启动

<form method="POST" id="search_form" onsubmit="SwapDivsWithClick()">

表单{
宽度：100%；
显示：内联块；
}
输入{
宽度：50%；
填充：20px；
边缘底部：10px；
边界半径：10px；
}



这正是我要讨论的问题。当我尝试此操作时，搜索框会在瞬间删除，结果会显示在应该显示的顶部，然后搜索框会重新出现并向下推送结果。这在代码中没有发生。您的脚本是否在提交后重新加载页面？如果您正在重新加载页面，任何DOM操作都会失败将是没有意义的。不，它只是获取结果，然后尝试将结果
回显到页面中。根本没有重新加载。响应代码是什么样子的？它是否包含表单？是的，表单显示在页面上？可能您会找到解决方案，请尝试此链接：-几乎有效。问题是它需要在数据库已被查询，并返回它们存在（从而删除该框）或不存在（从而保留该框以便再次搜索）的结果@Ethan因此，如果用户已经存在，它不应该隐藏搜索框，对吗？不，发生的是用户在搜索框（表单）中输入id号。当他们按submit时，它会查询数据库，查看a）是否存在具有该id号的任何人，如果存在b）将其所有数据返回到results div中，同时隐藏原始搜索div。@Ethan此代码段就是这样做的。当用户点击submit按钮时，搜索框将消失，而您可以显示results在另一个div中。您从这个代码片段中得到了什么行为？@Ethan很高兴我能有所帮助。-）您也可以只使用PHP完成同样的事情，也可以尝试一下。
<div class="search_box" <?php if(isset($_POST['newperson'])){ echo "style='display:none'"; } ?>>    
    <form method="POST" id="search_form">
        <input type="text" name="person_id" class="submission-boxes" placeholder="Person ID" required><br>
        <input type="submit" name="newperson" class="submission-btn" value="+ Add Person" id="find_em">
    </form>
</div>

<form method="POST" id="search_form" onsubmit="SwapDivsWithClick()">