zoukankan      html  css  js  c++  java
  • 利用jquery实现遮罩层

    js中的代码

      

    var userAgent = navigator.userAgent;
    var isChrome = userAgent.indexOf("Chrome") > -1 && userAgent.indexOf("Edg") < 0 ;
    var isEdge = userAgent.indexOf("Edg") > -1 && userAgent.indexOf("Chrome") > -1;


    function popError() { var popurl="http://localhost:8080/combi/index.html?serviceName=APC000&ACT_ID=INIT" //winpops=window.open(popurl, "COMMONPOP", "width=400,height=300,") //showModalDialog(popurl, window, "status:no;dialogWidth:450px;dialogHeight:350px"); var top = (window.screen.availHeight-30-350)/2; var left = (window.screen.availWidth-10-450)/2; if(isChrome && !isEdge){ var childWindow = window.open(popurl, "COMMONPOP", 'width=' + 450 + ',height=' + 350 + ',top=' + top + ',left=' + left); doMaskNoneBack(); $("#maskingArea").click(function(){ if(!childWindow.closed){ childWindow.focus(); } }); }else if(isEdge){ var childWindow = window.open(popurl, "COMMONPOP", 'width=' + 450 + ',height=' + 350 + ',top=' + top + ',left=' + left); doMaskNoneBack(); $("#maskingArea").click(function(){ if(!childWindow.closed){ childWindow.focus(); } }); }else{ showModalDialog(popurl, window, "status:no;dialogWidth:450px;dialogHeight:350px"); dialogOpenFlg = 0; return result; } //window.open(popurl,"APC110","width=400,height=300,"); }

    JSP代码

    <%@ page contentType="text/html; charset=Shift_JIS" %><html>
    <%@ include file="INCLUDE_HEADDER.JSP" %>
    <html>
    <head>
        <title>Combi Corporation</title>
        <META http-equiv=Content-Type content="text/html; charset=Shift_JIS">
        <link rel="stylesheet" type="text/css" href="jsp/common/common.css">
        <script type="text/javascript" src="jsp/common/common.js"></SCRIPT>
        <script src="jsp/common/jquery-3.6.0.js"></script>
        <script type="text/javascript" src="jsp/common/jquery.loadmask.js"></SCRIPT>
        <SCRIPT LANGUAGE="JavaScript">
    function popchk() {
    
      if (<%= sdh.isPopUp() %>) {
        popError();
      }
    }
        </SCRIPT>
    
    
    </head>
    
    <body onload="javascript:popchk()">
    <div id ="maskingArea">
    <form name="frmAPL000" action="<%= jp.co.moss.svr.MOSSConstURL.getURL("CONTROLER_NAME") %>" method="POST">
    <div style="1850px;height:930px;">
    <input type="hidden" name="serviceName" value="APL000">
    
    <!-- TOP START -->
    <table cellSpecing=0 cellPadding=0 width=100% border=0>
        <tr>
            <td>&nbsp;<IMG height=10 src="jsp/picture/space.gif" width=20></td>
            <td><IMG height=45 src="jsp/picture/logo_ap.gif" width=720></td>
            <td><IMG height=5 src="jsp/picture/space.gif" width=10></td>
        </tr>
        <tr>
            <td><IMG height=5 src="jsp/picture/space.gif" width=20></td>
            <td><IMG height=6 src="jsp/picture/topline.gif" width=100%></td>
            <td><IMG height=4 src="jsp/picture/space.gif" width=10></td>
        </tr>
    </table>
    <!-- TOP END -->
    <br>
    <!-- SUB TOP START -->
    <table cellSpecing=0 cellPadding=0 width=100% border=0>
        <tr>
            <td width=95% align='right'>ログイン</td>
            <td><IMG height=5 src="jsp/picture/space.gif" width=10></td>
        </tr>
    </table> 
    <!-- SUB TOP END -->
    <br><br>
    <!-- MAIN TABLE START ---------------------->
    <table cellSpecing=0 cellPadding=0 width=300 border=0 align='CENTER'>
        <tr>
            <td colspan="2">ユーザIDとパスワードを入力してください。</td>
        </tr>
            <tr height='15'>
            <td colspan='8'></td>
        </tr>
        <tr>
            <td width=100 align='right'>
                    <table width="120" border="0" cellspacing="0" cellpadding="1" class='ORALN'>
                      <tr>
                        <td>
                          <table width="100%" border="0" cellspacing="0" cellpadding="3" class='ORABG'>
                            <tr>
                              <td align='CENTER' class='ORA12'>ユーザID</td>
                            </tr>
                          </table>
                        </td>
                      </tr>
                    </table>
            </td>
            <td>
                &nbsp;<input type="text" name="txtUserId" value="<%= ds.getItem(jp.co.combi.biz.APL000.L0_USER_ID) %>" maxlength='12' class="input_txt" STYLE='150;height:25;ime-mode:disabled;'><!-- ユーザID -->
            </td>
        </tr>
    
        <tr height='5'>
            <td colspan='8'></td>
        </tr>
    
        <tr>
            <td width=100 align='right'>
                    <table width="120" border="0" cellspacing="0" cellpadding="1" class='ORALN'>
                      <tr>
                        <td>
                          <table width="100%" border="0" cellspacing="0" cellpadding="3" class='ORABG'>
                            <tr>
                              <td align='CENTER' class='ORA12'>パスワード</td>
                            </tr>
                          </table>
                        </td>
                      </tr>
                    </table>
                
            </td>
            <td>
                &nbsp;<input type="password" name="txtUserPwd" value="" maxlength='12'  class="input_txt" STYLE='150;height:25;ime-mode:disabled;'><!-- パスワード -->
            </td>
        </tr>
        <tr>
            <td><br><br></td>
        </tr>
        <tr>
            <td align='right' colspan="2">
                <input type='submit' name='btnLogin' value='ログイン' style='90;height:27;'  class="input_txt">
                <input type='button' name='btnExit' value='閉じる' style='90;height:27;' onClick="javascript:window.close();"  class="input_txt">
            </td>
        </tr>
    </table>
    </div>
    <!--MAIN TABLE END ---------------------->
    </form>
    </div>
    </body>
    </html>
  • 相关阅读:
    怎么判断自己在不在一家好公司?
    超全!互联网大厂的薪资和职级一览
    Nginx 又一牛 X 功能!流量拷贝
    时间管理之四象限法则
    罗永浩一个坑位卖60万脏钱背后:放下面子赚钱,才是成年人最大的体面
    2020 年 4月全国程序员工资出炉
    一次 SQL 查询优化原理分析(900W+ 数据,从 17s 到 300ms)
    “Hey Siri” 背后的黑科技大揭秘!
    一文讲透高薪的本质!
    python UnicodeDecodeError: 'gbk' codec can't decode byte 0x99 in position 87: illegal multibyte sequence异常解决
  • 原文地址:https://www.cnblogs.com/malun/p/15070578.html
Copyright © 2011-2022 走看看