页面间切换时间长，就添加了等待DIV，现在希望这个DIV仅当页面切换时间超过3秒时才出现，怎么半

Question

a.html 中通过点button 来切换到下一个页面 b.html
于是我在button 中设置事件 onclick=idleAlert("please wait for a while....") 作为等待期的缓冲。现在的问题是，我希望a -->b 页面跳转超过3秒时才出现该DIV ，若小于3秒则不出现。如下为 已经实现的DIV JS，求达人解惑===========function idleAlert(str) {
var msgw, msgh, bordercolor;
msgw = 280;
msgh = 100;
bordercolor = "#336699";
titlecolor = "#99CCFF"; var sWidth, sHeight;
sWidth = document.body.offsetWidth;
sHeight = document.body.offsetHeight; var bgObj = document.createElement("div");
bgObj.setAttribute('id', 'bgDiv');
bgObj.style.position = "absolute";
bgObj.style.top = "0";
bgObj.style.background = "#777";
bgObj.style.filter = "progid:DXImageTransform.Microsoft.Alpha(style=3,opacity=25,finishOpacity=75";
bgObj.style.opacity = "0.6";
bgObj.style.left = "0";
bgObj.style.width = sWidth + "px";
bgObj.style.height = sHeight + "px";
bgObj.style
document.body.appendChild(bgObj);
var msgObj = document.createElement("div")
msgObj.setAttribute("id", "msgDiv");
msgObj.setAttribute("align", "center");
msgObj.style.position = "absolute";
msgObj.style.background = "white";
msgObj.style.font = "12px/1.6em Verdana, Geneva, Arial, Helvetica, sans-serif";
msgObj.style.border = "1px solid " + bordercolor;
msgObj.style.width = msgw + "px";
msgObj.style.height = msgh + "px";
msgObj.style.top = (document.documentElement.scrollTop + (sHeight - msgh) / 2)
+ "px";
msgObj.style.left = (sWidth - msgw) / 2 + "px";
var title = document.createElement("h4");
title.setAttribute("id", "msgTitle");
title.setAttribute("align", "right");
title.style.margin = "0";
title.style.padding = "3px";
title.style.background = bordercolor;
title.style.filter = "progid:DXImageTransform.Microsoft.Alpha(startX=20, startY=20, finishX=100, finishY=100,style=1,opacity=75,finishOpacity=100);";
title.style.opacity = "0.75";
title.style.border = "1px solid " + bordercolor;
title.style.height = "18px";
title.style.font = "12px Verdana, Geneva, Arial, Helvetica, sans-serif";
title.style.color = "white";
title.style.cursor = "pointer";
title.innerHTML = "X";
title.onclick = function() {
// Close Div
document.body.removeChild(bgObj);
document.getElementById("msgDiv").removeChild(title);
document.body.removeChild(msgObj);
}
document.body.appendChild(msgObj);
document.getElementById("msgDiv").appendChild(title);
var txt = document.createElement("p");
txt.style.margin = "1em 0"
txt.setAttribute("id", "msgTxt");
txt.innerHTML = str;
document.getElementById("msgDiv").appendChild(txt);
} 

Answer 1

function idleAlert(str)
{
setTimeout(wait);
//}
function wait()
{
//显示div
}

Answer 2

function idleAlert(str)
{
setTimeout(wait,3000);
//}
function wait()
{
//显示div
}

Answer 3

延时3秒后执行这个
function  f(){
   document.body.appendChild(bgObj);
}
setTimeout(f(),3000);

Answer 4

用了1楼兄弟的方法，咋不行啊。现在是click后马上出DIV，但是里面没有内容
------------------function idleAlert(str) {
setTimeout(wait(),2000);
} function wait(){
var msgw, msgh, bordercolor;
msgw = 280;
msgh = 100;
bordercolor = "#336699";
titlecolor = "#99CCFF"; var sWidth, sHeight;
sWidth = document.body.offsetWidth;
sHeight = document.body.offsetHeight; var bgObj = document.createElement("div");
bgObj.setAttribute('id', 'bgDiv');
bgObj.style.position = "absolute";
bgObj.style.top = "0";
bgObj.style.background = "#777";
bgObj.style.filter = "progid:DXImageTransform.Microsoft.Alpha(style=3,opacity=25,finishOpacity=75";
bgObj.style.opacity = "0.6";
bgObj.style.left = "0";
bgObj.style.width = sWidth + "px";
bgObj.style.height = sHeight + "px";
bgObj.style
document.body.appendChild(bgObj);
var msgObj = document.createElement("div")
msgObj.setAttribute("id", "msgDiv");
msgObj.setAttribute("align", "center");
msgObj.style.position = "absolute";
msgObj.style.background = "white";
msgObj.style.font = "12px/1.6em Verdana, Geneva, Arial, Helvetica, sans-serif";
msgObj.style.border = "1px solid " + bordercolor;
msgObj.style.width = msgw + "px";
msgObj.style.height = msgh + "px";
msgObj.style.top = (document.documentElement.scrollTop + (sHeight - msgh) / 2)
+ "px";
msgObj.style.left = (sWidth - msgw) / 2 + "px";
var title = document.createElement("h4");
title.setAttribute("id", "msgTitle");
title.setAttribute("align", "right");
title.style.margin = "0";
title.style.padding = "3px";
title.style.background = bordercolor;
title.style.filter = "progid:DXImageTransform.Microsoft.Alpha(startX=20, startY=20, finishX=100, finishY=100,style=1,opacity=75,finishOpacity=100);";
title.style.opacity = "0.75";
title.style.border = "1px solid " + bordercolor;
title.style.height = "18px";
title.style.font = "12px Verdana, Geneva, Arial, Helvetica, sans-serif";
title.style.color = "white";
title.style.cursor = "pointer";
title.innerHTML = "X";
title.onclick = function() {
// Close Div
document.body.removeChild(bgObj);
document.getElementById("msgDiv").removeChild(title);
document.body.removeChild(msgObj);
}
document.body.appendChild(msgObj);
document.getElementById("msgDiv").appendChild(title);
var txt = document.createElement("p");
txt.style.margin = "1em 0"
txt.setAttribute("id", "msgTxt");
txt.innerHTML = str;
document.getElementById("msgDiv").appendChild(txt);
}

Answer 5

setTimeout(function () {
    //div默认隐藏，在点击后就调用这个方法，3m后显示
}, 3000);