JavaScript弹窗实现-优快云博客

本文链接：https://blog.youkuaiyun.com/guaxixi627/article/details/83668493

 1---------------------
   <script language="javascript">
   function donePost(str1,str2...)
    {
        把要打开的弹出窗口的参数传递给当前页面；
    }

    var isDisplay = false;
    var isOpen = false;
    var inputBox="";

    function openDiv(object1)
    {
        //设置弹出窗口的url
        url = "/bms/WEB-ROOT/bms/pub/selectUser.do?type=post&openerMethod=donePost&project_id="+document.all.projectId.value;
        //以下的基本上不需要改动
        text = '<iframe name="deeptree" style="width: 300;height: 250;" src="'+url+'" >不支持</iframe>';
        forTest.innerHTML=text;

        inputBox=object1;

        var left = inputBox.getBoundingClientRect().left;
        var top = inputBox.getBoundingClientRect().top;

        left = inputBox.getBoundingClientRect().left + inputBox.clientWidth;
        top = inputBox.getBoundingClientRect().top + inputBox.clientHeight;

        document.all.forTest.style.left = left;
        document.all.forTest.style.top = top;

        closeDiv();

        document.all.forTest.style.display = "";
        isDisplay = true;
    }

    function closeDiv()
    {
        objUnknown = window.event.srcElement;
        if(objUnknown==null)
            return;
        if(objUnknown.tagName == "INPUT" || objUnknown.tagName=="div")
        {
            if(objUnknown.name==inputBox.name||objUnknown.name=="deeptree")
            {
                return;
            }
        }

        if(isDisplay)
        {
            document.all.forTest.style.display = "none";
            isDisplay = false;
        }
    }    
    </Script>

    2--------------------------
    //<body 中加入以下东西 onclick="closeDiv();"> 表示单击<body>区域关闭弹出窗口
     <body leftmargin="0" topmargin="0" onclick="closeDiv();">  

    3-------------------------- 
      <form></form>中应该加入：                    
      <div id="forTest" style="border:0px solid #EEEEEE ;position: absolute; display:none; z-index: 0; background-color:white;"></div>
    4--------------------------

      需要用到弹出窗口道的地方加入 onClick="openDiv(this);" ：
      如：<input type="button" name="selectBt" onClick="openDiv(this);" class="button_bg3" value='选  择' style="cursor:hand">
      this表示当前form中的div[code="java"]

[/code]