延遲表單提交併顯示重定向覆蓋div

Question

我有一個通過javascript onmousedown提交的表單，並且我希望在整個頁面上顯示覆蓋div 5秒，並在表單提交之前或之中顯示「請稍候重定向」消息在形式中提到的網址。這裏是我的代碼

<form method="POST" action="formsubmit.php" id="mainForm" target="_parent"> 
<label for=fname>Name</label><br/> 
<input name="fname" id="fname" type="text" /><br> 
<label for=email>Email address</label><br/> 
<input name="email" id="email" type="text" /><br> 
<input type="button" id="formbutton" value="Submit" onmousedown="sendForm()"> 
</form> 

我的JavaScript函數

function sendForm() 
{ 
var contin = 1; 
var alertmessage = ""; 
var eValue = $("#email").val(); 
var dot1=eValue.lastIndexOf("."); 
var at1=eValue.indexOf("@"); 
if (at1<1 || dot1<at1+2 || dot1+2>=eValue.length || eValue.length < 7) 
{ 
alertmessage += "Please enter a valid email\n"; 
    contin = 0; 
} 
if ($("#fname").val().length < 3) 
{ 
    alertmessage += "Please enter a name\n"; 
    contin = 0; 
} if (contin == 1) 
{ 
    if (document.getElementById("formbutton")) $("#formbutton").hide(); 
$("#mainForm").submit(); 
} 
else alert(alertmessage); 
} 

我看到了它不少線程，但我不知道我怎麼會包括在我現有的JavaScript函數的功能，所以我用我的確切代碼問這個問題。由於

Answer 1

我能解決我的問題，所以如果任何一個尋找相同的答案，這是我必須做的

<style> 
#waitingredirCover { 
    background: url("http://www.aveva.com/Images/ajax-loader.gif") no-repeat scroll center center #FFF; 
    position: fixed; 
    height: 100%; 
    width: 100%; 
    text-align: center; 
    z-index: 9999; 
    top:  0; 
    left:  0; 
} 
</style> 


function stopRKey(evt) { 
    var evt = (evt) ? evt : ((event) ? event : null); 
    var node = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null); 
    if ((evt.keyCode == 13) && (node.type=="text")) {return false;} 
} 
document.onkeypress = stopRKey; 

function sendForm() 
{ 
var contin = 1; 
var alertmessage = ""; 
var eValue = $("#email").val(); 
var dot1=eValue.lastIndexOf("."); 
var at1=eValue.indexOf("@"); 
if (at1<1 || dot1<at1+2 || dot1+2>=eValue.length || eValue.length < 7) 
{ 
alertmessage += "Please enter a valid email\n"; 
    contin = 0; 
} 
lcpsExitPopupOn = 0; 
if ($("#fname").val().length < 3) 
{ 
    alertmessage += "Please enter a name\n"; 
    contin = 0; 
} if (contin == 1) 
{ 
    if (document.getElementById("formbutton")) $("#formbutton").hide(); 
document.getElementById("waitingredirCover").style.display = "block"; 
    setTimeout(function() { 
     $("#mainForm").submit(); 
    }, 5000); 
} 
else alert(alertmessage); 
} 

<div id="waitingredirCover" style="display:none;"><h3>Please wait! You are being redirected to your page.</h3></div>