Javascript 提交表单后（或按“发送”按钮后）显示div

我的任务是在提交表单后使div可见。问题是：提交表单后，div出现0.5秒，然后再次消失

这是相关的代码部分。我想用id=“data”显示div

我尝试了两种不同的方法：

第一个是将onclick=“show\u div（）添加到提交按钮

<input type="submit" class="bttn" class="item" onclick="show_div()" value="Send" /><br/>

下面是PHP代码：

$cloud = "";
$Email = "";
$Password = "";
$Name = "";
$Total_GB = "";
$GB_Used = "";
$About = "";
$Decryption = "";
$Authy = "";



if($_SERVER["REQUEST_METHOD"] == "POST") { 



    $servername = "localhost";
    $username = "root";
    $password = "";
    $db = "xxx";


    $con = mysql_connect($servername,$username,$password);

    if (!$con) {

    die('Could not connect: ' . mysql_error());

    }

    mysql_select_db("xxx", $con); 


    $cloud = $_POST["Request"];

    // Query
    $query = "SELECT * FROM Clouds WHERE Name = '$cloud' LIMIT 1";
    $result = mysql_query($query) or die(mysql_error());

    if ($result >= 1) {
        while($row = mysql_fetch_assoc($result)) {

            $Email = $row['Email'];
            $Password = $row['Password'];
            $Name = $row['Name'];
            $Total_GB = $row['Total_GB'];
            $GB_Used = $row['GB_Used'];
            $About = $row['About'];
            $Decryption = $row['Decryption'];
            $Authy = $row['Authy'];
            
            }
    } else {
        //$error_not_found = "Account not found!";
    }
}

我错过了什么？有什么建议吗？谢谢

---

我检查了所有内容。我也遵循了她的提示。没有结果。好吧……相同的结果

这是一个您可以使用的片段。无法显示div并同时发送表单，请参见上面的注释

<form id="form1" action="..." method="post">
  <!-- here your form fileds -->
</form>

// true = show div --- false = send form
var showDiv = true;

// form id selector
var myForm = document.querySelector("#form1");

// bind submit event to form
myForm.addEventListener("submit", function(event) {
  if (showDiv == false) {
    console.log('send form');
    return;
  }
  event.preventDefault();
  console.log('Show div, form not send');
  var div = document.getElementById("data");
  div.style.display = "block";
});

//true=显示div---false=发送表单
var showDiv=true；
//表单id选择器
var myForm=document.querySelector（“form1”）；
//将提交事件绑定到表单
myForm.addEventListener（“提交”，函数（事件）{
if（showDiv==false）{
console.log（'send form'）；
返回；
}
event.preventDefault（）；
log（'Show div，form not send'）；
var div=document.getElementById（“数据”）；
div.style.display=“块”；
});

表单将提交到

操作

中定义的页面，将用户的浏览器移动到该页面（因此仅显示div，直到浏览器绘制下一页）。如果您希望提交数据而不使用此默认行为，请使用AJAX提交数据。那么，在表单提交后，按“提交”按钮后显示div如何？我对HTML不熟悉，不知道使用AJAX应该/应该如何操作。抱歉。当您提交表单时，页面是否会重新加载？我不这样认为。我将发布当您提交表单时，PHP代码tooThe页面将重新加载。您可以取消表单提交事件，例如：通过添加“return false；“在显示div（在js中）后。Credits@badsyntax这是“提交”事件的基本事件处理程序。您可以将其用于服务器的AJAX响应，也可以用于弹出div。如果您想从弹出div发送表单，请在div上单击此按钮时，在其上放置一个OK按钮，以提交表单。

<form action="" method="post" onsubmit="show_div()">

#data {
    border-top: dashed 3px rebeccapurple;
    border-left: dashed 3px rebeccapurple;
    padding-left: 20px;
    display: block;
}

$cloud = "";
$Email = "";
$Password = "";
$Name = "";
$Total_GB = "";
$GB_Used = "";
$About = "";
$Decryption = "";
$Authy = "";



if($_SERVER["REQUEST_METHOD"] == "POST") { 



    $servername = "localhost";
    $username = "root";
    $password = "";
    $db = "xxx";


    $con = mysql_connect($servername,$username,$password);

    if (!$con) {

    die('Could not connect: ' . mysql_error());

    }

    mysql_select_db("xxx", $con); 


    $cloud = $_POST["Request"];

    // Query
    $query = "SELECT * FROM Clouds WHERE Name = '$cloud' LIMIT 1";
    $result = mysql_query($query) or die(mysql_error());

    if ($result >= 1) {
        while($row = mysql_fetch_assoc($result)) {

            $Email = $row['Email'];
            $Password = $row['Password'];
            $Name = $row['Name'];
            $Total_GB = $row['Total_GB'];
            $GB_Used = $row['GB_Used'];
            $About = $row['About'];
            $Decryption = $row['Decryption'];
            $Authy = $row['Authy'];
            
            }
    } else {
        //$error_not_found = "Account not found!";
    }
}

<form id="form1" action="..." method="post">
  <!-- here your form fileds -->
</form>

// true = show div --- false = send form
var showDiv = true;

// form id selector
var myForm = document.querySelector("#form1");

// bind submit event to form
myForm.addEventListener("submit", function(event) {
  if (showDiv == false) {
    console.log('send form');
    return;
  }
  event.preventDefault();
  console.log('Show div, form not send');
  var div = document.getElementById("data");
  div.style.display = "block";
});