隐藏在执行 Ajax 脚本后填充的 div(一段时间后)

我对javascript很陌生。

我知道，此示例代码的作用很简单。一切正常 - 最后"名字"和"姓氏"打印到 #statusdiv。

谁能告诉我如何在通过 javascript 填充后 5 秒后淡化该div？

这是我的代码：

索引.html

<html>
 <head>
 <script src="ajax.js"></script>
 </head>
 <body>
  <h3>Testpage</h3>
  First Name: <input id="fn" name="first_name" type="text">  <br><br>
  Last Name: <input id="ln" name="last_name" type="text"> <br><br>
  <input name="sbmt" type="submit" value="Submit" onclick="ajax();">     <br><br>
  <div id="status"></div>
 </body>
</html>

阿贾克斯.js

function ajax_post(){
    var hreq = new XMLHttpRequest();
    var url = "php.php";
    var fn = document.getElementById("fn").value;
    var ln = document.getElementById("ln").value;
    var vars = "fn="+fn+"&ln="+ln;
    hreq.open("POST", url, true);
    hreq.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    hreq.onreadystatechange = function() {
        if(hreq.readyState == 4 && hreq.status == 200) {
            var return_data = hreq.responseText;
            document.getElementById("status").innerHTML = return_data;
        }
    }
    hreq.send(vars);
    document.getElementById("status").innerHTML = "processing...";
}

PHP.php

<?php 
echo 'Firstname: '. $_POST['fn'] . '<br>Lastname: ' . $_POST['ln'];
?>

提前感谢！

问候

安德烈亚斯

您可以在打印名字和姓氏后使用 setTimeOut 函数，如下所示

     setTimeout(function(){ document.getElementById("status").style.display='none' }, 5000);

相关内容

最新更新

热门标签：