div 覆蓋asp.net頁面

表單提交時的頁面覆蓋
當提交表單時,此時操作人員只需等待結果返回,這裏,我實現了一個覆蓋網頁的方法,使得整個網頁被一個很大的div覆蓋,這樣操作人員就不能點擊頁面的內容了。實現很簡單,一個div
    <div id="doing" style="Z-INDEX: 12000; LEFT: 0px; WIDTH: 100%; CURSOR: wait; POSITION: absolute; TOP: 0px; HEIGHT: 100%; display:none ">
            <table width="100%" height="100%">
                <tr align="center" valign="middle">
                    <td>
                        <table width="169" height="62" bgcolor="#99cccc" style="FILTER: Alpha(Opacity=75); WIDTH: 169px; HEIGHT: 62px">
                            <tr align="center" valign="middle">
                                <td>頁面提交中.<br>
                                    Loading.</td>
                            </tr>
                        </table>
                    </td>
                </tr>
            </table>
        </div>
     頁面最初載入時把它隱藏起來,當按下提交按鈕時讓它顯示。結果返回後再次讓它隱藏。jsp代碼:
     <%
         String content=request.getParameter("tc");
          if(content==null){
    %>
        <form action="#" method="post" οnsubmit="return show()">
          <textarea name="tc">dfdfsdf
             dfdaf</textarea>
           <input type=submit value=" go " >
       </form>
   <%
     }
       else{
          if(content.indexOf("/n")==-1)
            out.println("haha");
            // content=content.replaceAll("/n","<br>");
   %>
          <textarea> <% out.println(content); %>
       </textarea>
   <%
     }
   %>
   show方法:
    function show(){
         document.getElementById('doing').style.display=''
        return true;
   }
    當表單提交併返回結果時,頁面重新加載,div的display屬性自動又變爲none。達到了想要的效果。
div 覆蓋asp.net頁面

<script language="javascript">
    function fGoto()
    {
     var w = window.screen.availWidth -100 ;

     var h = self.screen.availHeight -200;  

     var doc=window.document;

     var div=doc.createElement("DIV");

     var info="<table border=1 STYLE=width:"+ w +";height:"+ h +";background-color:red;filter:alpha(opacity=30)><tr><td align=/"center/"><input type=button value=返回 οnclick=javascript:document.getElementsByTagName('BODY')[0].removeChild(showerr);></td></tr></table>"

     div.id='showerr';

     div.style.position='absolute';

     div.style.z_index=100;

     div.style.width=900;

     div.style.left=0;

     div.style.top=0;

     div.innerHTML=info;

     doc.getElementsByTagName("BODY")[0].appendChild(div);

    }
</script>
<html>
<body>
<img οnclick="javascript:fGoto()">
</body>
</html>

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章