javascript - 淡入淡出联系表“谢谢”司

我有一个使用javascript和contact.php代码的电子邮件提交表单

这是javascript

function createRequestObject() {
    var ro;
    var browser = navigator.appName;
    if(browser == "Microsoft Internet Explorer"){
        ro = new ActiveXObject("Microsoft.XMLHTTP");
    }else{
        ro = new XMLHttpRequest();
    }
    return ro;
}
var http = createRequestObject();
function sendemail() {
    var email = document.contactform.email.value;
    document.contactform.send.disabled=true;
    http.open('get', '/contact.php?email='+email+'&action=send');
    http.onreadystatechange = handleResponse;
    http.send(null);
}
function handleResponse() {
    if(http.readyState == 4){
        var response = http.responseText;
        var update = new Array();
        if(response.indexOf('|' != -1)) {
            update = response.split('|');
            document.getElementById(update[0]).innerHTML = update[1];
        }
    }
}

这是contact.php的一部分

<?php

$to = ""; //This is the email address you want to send the email to
$subject_prefix = ""; //Use this if you want to have a prefix before the subject

if(!isset($_GET['action']))

{
die("You must not access this page directly!"); //Just to stop people from visiting contact.php normally
}

$subject = "Newsletter Sign Up"; //The senders subject
$message = trim($_GET['email']); //The senders subject
$email = ""; //The senders email address

mail($to,$subject,$message,"From: ".$email.""); //a very simple send

echo 'contactarea|<div id="thanks">thank you</div>'; //now lets update the "contactarea" div on the contact.html page. The contactarea| tell's the javascript which div to update.
?>

和HTML

<div id="contactarea">
<form name="contactform" id="contactform">
<input class ="email" type="text" name="email" id="inputbox" value="e-mail"
onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;"/>
<input type="submit" value="sign up" name="send" onclick="sendemail(); return false; " class="signup" >
</form>
</div>

我试图在5秒钟后淡出“谢谢”，但遇到了一些麻烦。

如果我将其设置为在单击“提交”按钮时淡入淡出，则似乎无法正常工作，因为直到单击该按钮后它才出现。

如果将其设置为在加载时淡入淡出，则只有在淡入淡出时间之前单击该按钮时，它才有效

有没有一种方法可以淡出页面负荷而不是div本身负荷呢？

最佳答案

怎么样：

function sendemail() {
var email = document.contactform.email.value;
document.contactform.send.disabled=true;
http.open('get', '/contact.php?email='+email+'&action=send');
http.onreadystatechange = handleResponse;
http.send(null);
}

至：

function sendemail() {
var email = document.contactform.email.value;
document.contactform.send.disabled=true;
http.open('get', '/contact.php?email='+email+'&action=send');
http.onreadystatechange = handleResponse;
http.send(null);

    setTimeout(function(){
        $(document).find("#thanks").fadeOut();
    },5000);

}

关于javascript - 淡入淡出联系表“谢谢”司，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/28423019/