JS 隐藏显示DIV解决思路-JavaSript-爱易网页

JS 隐藏显示DIV解决思路

日期：2014-05-16　浏览次数：20298 次

JS 隐藏显示DIV
我想实现的功能：

通过JS，点击一个按钮
自动弹出一个DIV在显示器的中央，里面的内容写“请稍后。。。”
并且这个页面的所有信息都不能被点击
过了3秒，DIV自动关闭

哪位知道怎么写的帮我解决下

------解决方案--------------------
用模态窗口模拟一个，不一定非得要div
------解决方案--------------------
window.showModalDialog(sURL[,vArguments][,sFeatures]); 一个模态窗体，当然页面内容可以自己随便写，然后 setTimeout()3秒之后，window.close()。~
------解决方案--------------------

HTML code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script type="text/javascript">
    function test(){
        divTest.innerHTML ="请稍后...";
        setTimeout('hideMethod()',3000);
    }
    
    function hideMethod(){
        divTest.style.display="none";
    }
</script>
</head>

<body>
<form id="form1" method="post">
    <input type="button" onclick="test()" value="测试" />
</form>
<div id="divTest" style="background-color:red"></div>
</body>
</html>

------解决方案--------------------
HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
    .mystyle
    {position:absolute;
     top:50%;
     left:50%;
     text-align:center;
     margin:-100px 0 0 -100px;
     width:200px;
     height:100px;    /*这里，height和line-height的值设置成一样，使文字垂直居中显示在DIV当中*/
     line-height:100px;
     background:#000 ;
     FILTER: progid:DXImageTransform.Microsoft.Gradient(startColorStr='#ffffff', endColorStr='#00009B', gradientType='0');
    }
</style>
<div></div>
<script type="text/javascript">
    function test(){
        document.getElementById("divTest").className="mystyle";
        divTest.innerHTML ="请稍后......";
        setTimeout('hideMethod()',3000);
    }
    
    function hideMethod(){
        divTest.style.display="none";
    }
</script>
</head>

<body>
<form id="form1" method="post">
    <input type="button" onclick="test()" value="测试" />
</form>
<div id="divTest"></div>
</body>
</html>

------解决方案--------------------
代码上传到http://www.dbank.com/download.action?t=40&k=Mzc5NDIzNA==&pcode=LCw0NTEyMiw0NTEyMg==&rnd=9763

免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。

JS 隐藏显示DIV解决思路

相关资料更多>

推荐阅读更多>