<!-- saved from url=(0022)http://internet.e-mail -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<!-- saved from url=(0038)http://www.o2sky.cn/demo/css/absfloat/ -->
<HTML xmlns="http://www.w3.org/1999/xhtml"><HEAD>
<META http-equiv=Content-Type content="text/html; charset=utf-8">
<STYLE type=text/css>HTML {
BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; OVERFLOW: hidden; HEIGHT: 100%; BORDER-RIGHT-WIDTH: 0px
}
BODY {
FONT-SIZE: 16px; MARGIN: 0px; OVERFLOW: hidden; HEIGHT: 100%
}
BUTTON {
FONT-SIZE: 14px;
WIDTH: 60px;
BORDER-RIGHT: #99a8bd 2px solid;
BORDER-TOP: #99a8bd 1px solid;
BORDER-LEFT: #99a8bd 1px solid;
BORDER-BOTTOM: #99a8bd 2px solid;
}h3 {
    color:white;
}#mainbody {
OVERFLOW-Y: scroll; OVERFLOW-X: auto; WIDTH: 100%; HEIGHT: 100%
}
#main {
BACKGROUND: #ccc; MARGIN: 4px; HEIGHT: 2000px
}
#transparent {
DISPLAY: none; BACKGROUND: #fff; FILTER: alpha(opacity=40); WIDTH: 100%; POSITION: absolute; HEIGHT: 100%; opacity: 0.4
}
.active#transparent {
DISPLAY: block
}
.absbox {
DISPLAY: none; BACKGROUND: #fff; POSITION: absolute
}
.active {
DISPLAY: block
}
#addnew {
BORDER-RIGHT:  2px solid;
BORDER-TOP:  1px solid;
BORDER-LEFT:  1px solid;
WIDTH: 360px;
BORDER-BOTTOM:  2px solid;
background-color:#CCCCCC;
}#addnew H3 {
PADDING-RIGHT: 5px; PADDING-LEFT: 15px; FONT-SIZE: 14px; BACKGROUND: red; PADDING-BOTTOM: 5px; MARGIN: 0px; CURSOR: move; PADDING-TOP: 5px
}
#addnew H3 SPAN.fr {
MARGIN-TOP: -3px; FLOAT: right; CURSOR: pointer
}
#addnew H3 BUTTON {
BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: #e9f2fb; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px
}
#addnew TABLE {
BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; MARGIN: 10px 15px 15px; WIDTH: 320px; BORDER-RIGHT-WIDTH: 0px
}
#addnew TH {
BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 3px; VERTICAL-ALIGN: top; LINE-HEIGHT: 22px; PADDING-TOP: 3px; HEIGHT: auto; BORDER-RIGHT-WIDTH: 0px
}
#addnew TD {
BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 3px; VERTICAL-ALIGN: top; LINE-HEIGHT: 22px; PADDING-TOP: 3px; HEIGHT: auto; BORDER-RIGHT-WIDTH: 0px
}
#addnew TH {
FONT-WEIGHT: bold
}
#addnew TD {
WIDTH: 65%
}
#addnew INPUT {
WIDTH: 100%
}
#addnew BUTTON {
LINE-HEIGHT: normal
}
#cen_div {
margin-bottom:10px;
text-align:center;
}
</STYLE><SCRIPT language=javascript type=text/javascript>
var common={bind:function(o,ev,fn){
if (document.all){
o.attachEvent('on'+ev,fn);////////////IE绑定上但是fn里this指向window
}
else{
o.addEventListener(ev,fn,false);
}
return o;
},addClass:function (el,cls){
var arrCls=cls.split(/[ ]+/);
if(el.className){
for(var i=0;i<arrCls.length;i++){
if(el.className.indexOf(arrCls[i])>=0){
cls=cls.replace(new RegExp('[ ]*'+arrCls[i]+'[ ]*'),' ');////////有缺陷
}
}
el.className=[el.className].concat(cls).join(' ');
}
else{
el.className=cls;
}
},removeClass:function (el,cls){
if(el.className){
if(el.className.indexOf(cls)>=0){
el.className=el.className.replace(new RegExp('[ ]*'+cls+'[ ]*','g'),' ');
}
}
}};function init(){
var drag1=document.getElementById('addnew');
var drag1bar=drag1.getElementsByTagName('h3')[0];
new DragObject({module:drag1,handle:drag1bar});

var addnewPop=new Popup({module:drag1,background:document.getElementById('transparent')});
document.getElementById('addnew_btnclz').onclick=addnewPop.hide;
document.getElementById('ok_btn').onclick=addnewPop.hide;
document.getElementById('switch').onclick=addnewPop.show;
}common.bind(window,'load',init);
function DragObject(args){
var module=typeof(args.module)=='string'?document.getElementById(args.module):args.module;
var handle=typeof(args.handle)=='string'?document.getElementById(args.handle):args.handle;

function startDrag(e){
var e=e||window.event;
//var elem=e.target||e.srcElement;

document.onmousemove=onDrag;
document.onmouseup=stopDrag;

//储存当前坐标差值参数
module.subX=module.offsetLeft-e.clientX;
module.subY=module.offsetTop-e.clientY;

return false;
}

function onDrag(e){
e=e||window.event;

module.style.left=module.subX+e.clientX+'px';
module.style.top=module.subY+e.clientY+'px';

return false;
}

function stopDrag(){
document.onmousemove=null;
document.onmouseup=null;
}

handle.onmousedown=startDrag;

}function Popup(args){
var module=typeof(args.module)=='string'?document.getElementById(args.module):args.module;
var background=args.background?(typeof(args.background)=='string'?document.getElementById(args.background):args.background):null;

this.show=function(){
common.addClass(module,'active');
if(background){
common.addClass(background,'active');
}
};

this.hide=function(){
common.removeClass(module,'active');
if(background){
common.removeClass(background,'active');
}
};
}
</SCRIPT><META content="MSHTML 6.00.2900.3492" name=GENERATOR></HEAD>
<BODY>
<DIV id=absbox>
<DIV class=active id=transparent></DIV>
<DIV class="absbox active" id=addnew>
<H3> Confirm </H3>
<br>
&nbsp;&nbsp;The set value is not proper. Check it.
<div  id=cen_div>
  <br>
  <BUTTON id=ok_btn>OK</BUTTON>
  <br>
</div>
</DIV></DIV></BODY></HTML>

解决方案 »

  1.   

    上面的代码是window float.htm
      

  2.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
    <HTML xmlns="http://www.w3.org/1999/xhtml"> <HEAD>
    <META http-equiv=Content-Type content="text/html; charset=utf-8">
    <STYLE type=text/css>HTML {
    BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; OVERFLOW: hidden; HEIGHT: 100%; BORDER-RIGHT-WIDTH: 0px
    }
    BODY {
    FONT-SIZE: 16px; MARGIN: 0px; OVERFLOW: hidden; HEIGHT: 100%
    }
    BUTTON {
    FONT-SIZE: 14px;
    WIDTH: 60px;
    BORDER-RIGHT: #99a8bd 2px solid;
    BORDER-TOP: #99a8bd 1px solid;
    BORDER-LEFT: #99a8bd 1px solid;
    BORDER-BOTTOM: #99a8bd 2px solid;
    }h3 {
        color:white;
    }#mainbody {
    OVERFLOW-Y: scroll; OVERFLOW-X: auto; WIDTH: 100%; HEIGHT: 100%
    }
    #main {
    BACKGROUND: #ccc; MARGIN: 4px; HEIGHT: 2000px
    }
    #transparent {
    DISPLAY: none; BACKGROUND: #fff; FILTER: alpha(opacity=40); WIDTH: 100%; POSITION: absolute; HEIGHT: 100%; opacity: 0.4
    }
    .active#transparent {
    DISPLAY: block
    }
    .absbox {
    DISPLAY: none; BACKGROUND: #fff; POSITION: absolute
    }
    .active {
    DISPLAY: block
    }
    #addnew {
    BORDER-RIGHT:  2px solid;
    BORDER-TOP:  1px solid;
    BORDER-LEFT:  1px solid;
    WIDTH: 360px;
    BORDER-BOTTOM:  2px solid;
    background-color:#CCCCCC;
    }#addnew H3 {
    PADDING-RIGHT: 5px; PADDING-LEFT: 15px; FONT-SIZE: 14px; BACKGROUND: red; PADDING-BOTTOM: 5px; MARGIN: 0px; CURSOR: move; PADDING-TOP: 5px
    }
    #addnew H3 SPAN.fr {
    MARGIN-TOP: -3px; FLOAT: right; CURSOR: pointer
    }
    #addnew H3 BUTTON {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: #e9f2fb; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TABLE {
    BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; MARGIN: 10px 15px 15px; WIDTH: 320px; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TH {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 3px; VERTICAL-ALIGN: top; LINE-HEIGHT: 22px; PADDING-TOP: 3px; HEIGHT: auto; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TD {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 3px; VERTICAL-ALIGN: top; LINE-HEIGHT: 22px; PADDING-TOP: 3px; HEIGHT: auto; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TH {
    FONT-WEIGHT: bold
    }
    #addnew TD {
    WIDTH: 65%
    }
    #addnew INPUT {
    WIDTH: 100%
    }
    #addnew BUTTON {
    LINE-HEIGHT: normal
    }
    #cen_div {
    margin-bottom:10px;
    text-align:center;
    }
    </STYLE><SCRIPT language=javascript type=text/javascript>
    var common={ bind:function(o,ev,fn){
    if (document.all){
    o.attachEvent('on'+ev,fn);
    }
    else{
    o.addEventListener(ev,fn,false);
    }
    return o;
    }, addClass:function (el,cls){
    var arrCls=cls.split(/[ ]+/);
    if(el.className){
    for(var i=0;i <arrCls.length;i++){
    if(el.className.indexOf(arrCls[i])>=0){
    cls=cls.replace(new RegExp('[ ]*'+arrCls[i]+'[ ]*'),' ');
    }
    }
    el.className=[el.className].concat(cls).join(' ');
    }
    else{
    el.className=cls;
    }
    }, removeClass:function (el,cls){
    if(el.className){
    if(el.className.indexOf(cls)>=0){
    el.className=el.className.replace(new RegExp('[ ]*'+cls+'[ ]*','g'),' ');
    }
    }
    }};function init(){
    var drag1=document.getElementById('addnew');
    var drag1bar=drag1.getElementsByTagName('h3')[0];
    new DragObject({module:drag1,handle:drag1bar}); var addnewPop=new Popup({module:drag1,background:document.getElementById('transparent')});
    document.getElementById('addnew_btnclz').onclick=addnewPop.hide;
    document.getElementById('ok_btn').onclick=addnewPop.hide;
    document.getElementById('switch').onclick=addnewPop.show;
    }common.bind(window,'load',loadCallback);function loadCallback() {
    common.bind(document.getElementById('test'), 'click', function(e) {
    document.getElementById('message_box').style.display = '';
    });
    common.bind(document.getElementById('ok_btn'), 'click', function(e) {
    document.getElementById('message_box').style.display = 'none';
    });
    }function DragObject(args){
    var module=typeof(args.module)=='string'?document.getElementById(args.module):args.module;
    var handle=typeof(args.handle)=='string'?document.getElementById(args.handle):args.handle; function startDrag(e){
    var e=e||window.event;
    //var elem=e.target||e.srcElement; document.onmousemove=onDrag;
    document.onmouseup=stopDrag;
    module.subX=module.offsetLeft-e.clientX;
    module.subY=module.offsetTop-e.clientY; return false;
    } function onDrag(e){
    e=e||window.event; module.style.left=module.subX+e.clientX+'px';
    module.style.top=module.subY+e.clientY+'px'; return false;
    } function stopDrag(){
    document.onmousemove=null;
    document.onmouseup=null;
    } handle.onmousedown=startDrag;}function Popup(args){
    var module=typeof(args.module)=='string'?document.getElementById(args.module):args.module;
    var background=args.background?(typeof(args.background)=='string'?document.getElementById(args.background):args.background):null; this.show=function(){
    common.addClass(module,'active');
    if(background){
    common.addClass(background,'active');
    }
    }; this.hide=function(){
    common.removeClass(module,'active');
    if(background){
    common.removeClass(background,'active');
    }
    };
    }
    </SCRIPT><META content="MSHTML 6.00.2900.3492" name=GENERATOR> </HEAD>
    <BODY>
    <input type="button" id="test" value="show box">
    <div id="message_box" style="display: none">
    <DIV id=absbox>
    <DIV class=active id=transparent> </DIV>
    <DIV class="absbox active" id=addnew>
    <H3> Confirm </H3>
    <br>
    &nbsp;&nbsp;The set value is not proper. Check it.
    <div  id=cen_div>
      <br>
      <BUTTON id=ok_btn>OK </BUTTON>
      <br>
    </div>
    </DIV> </DIV> </div></BODY> </HTML>你看看是不是你想要的
      

  3.   

    <input type="button" onclick="function()"> 别用关键字
      

  4.   

    用了关键字 贴了一大堆,以后问什么先把没有用的代码去了,那么多css晕。
      

  5.   

    小一还有一个。
    <!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>
    <script>    var abc=-1;
    var  leftnum ;
    var  heightnum;
        function showalert2(){
         abc++;
            var Br = new innerMessageBox();
            Br.ShowModal('check', 'msg', 320, 120, "gourl($)");
        }    function innerMessageBox(){
            var BackObject, FormObject;        function checkIMBObject(){
                if (document.getElementById("imb_Background")==null){
                    document.body.innerHTML += "<iframe id=\"imb_Background\" src=\"about:blank\" style=\"position:absolute;left:0;top:0;width:0px;height:0px;visibility:hidden;\" frameborder=\"0\"></iframe>";
                    window.imb_Background.document.open();
                    window.imb_Background.document.write("<html><body bgcolor=red>&nbsp;sdfasdfasdf</body></html>");
                    window.imb_Background.document.close();
                }
                if (document.getElementById("imb_FormModal")==null){
                    document.body.innerHTML += "<iframe id=\"imb_FormModal\" src=\"about:blank\" style=\"position:absolute;left:0;top:0;width:0px;height:0px;visibility:hidden;border-bottom:2px solid #999999;border-right:2px solid #999999;border-top:1px solid #F8F6C1;border-left:1px solid #F8F6C1;\" frameborder=\"0\"></iframe>";
                    window.imb_FormModal.document.open();
                    window.imb_FormModal.document.write("<html><head><style><!--");
                    window.imb_FormModal.document.write("td{font-size:12px;");
                    window.imb_FormModal.document.write("//--></style></head><body scroll=no leftmargin=0 topmargin=0>");
                    window.imb_FormModal.document.write("<table width=100% height=100% bgcolor=\"#eeeeee\"><tr><td  align=left bgcolor=red><div id=\"imb_Title\" style=\"padding-left:3px;padding-right:3px;color:white;font-family:verdana;\">");
                    window.imb_FormModal.document.write("</div></td></tr><tr><td align=left><div id=\"imb_Content\" style=\"padding:7px;\">");
                    window.imb_FormModal.document.write("</div></td></tr><tr><td id=\"imb_Body\" align=center>");
                    window.imb_FormModal.document.write("</td></tr></table>");
                    window.imb_FormModal.document.write("</body></html>");
                    window.imb_FormModal.document.close();
                }
            }
            this.ShowModal = function(iCaption, iMessage, iWidth, iHeight, iClickFunc, iOther){
                var smWidth = 420, smHeight = 180, smCaption = "", smMessage="", smFunc, smObject, smAlpha, smInterval;
                if (arguments.length > 4 ){
                    smWidth = iWidth;
                    smHeight = iHeight;
                    smCaption = iCaption;
                    smMessage = iMessage;
                    smFunc = iClickFunc;
                }
                function checkIMBAlpha(){
                    //smObject.style.filter = "alpha(opacity="+smAlpha+");";
    smObject.style.filter = "alpha(opacity=0);";
                    smAlpha += 10;
                    if (smAlpha>5){
                        clearInterval(smInterval);
                    }
                }
                checkIMBObject();
                this.BackObject = document.getElementById("imb_Background");
                this.FormObject = document.getElementById("imb_FormModal");            smObject = this.BackObject;
                smAlpha = 0;
                this.BackObject.style.left = 0;
                this.BackObject.style.top = 0;
                if (abc==0)
                {
                 leftnum=document.body.scrollWidth
                 heightnum=document.body.scrollHeight
                }
                //this.BackObject.style.width = document.body.scrollWidth;
                //this.BackObject.style.height = document.body.scrollHeight;
                this.BackObject.style.width = leftnum;
                this.BackObject.style.height = heightnum;
                this.BackObject.style.visibility = "visible";
                //this.BackObject.style.zIndex=1000;
                smInterval = window.setInterval(checkIMBAlpha, 5);            this.FormObject.style.left = document.body.clientWidth/2 - smWidth/2-70;
                this.FormObject.style.top = document.body.clientHeight/2 - smHeight/2-30;
                this.FormObject.style.width = smWidth;
                this.FormObject.style.height = smHeight;
                this.FormObject.style.visibility = "visible";
    this.FormObject.style.borderColor='black';
    this.FormObject.style.zIndex=1000;
                window.imb_FormModal.document.getElementById("imb_Title").innerHTML = "<b>" + smCaption + "</b>";
                window.imb_FormModal.document.getElementById("imb_Content").innerHTML = smMessage;
                window.imb_FormModal.document.getElementById("imb_Body").innerHTML = "<input type=submit id=imb_Ok name=imb_Ok value=\"  ok  \">";
                //document.body.disabled = true;
                window.imb_FormModal.document.getElementById("imb_Ok").onclick= function(){
       
                document.getElementById("imb_Background").style.visibility = "hidden";
                document.getElementById("imb_FormModal").style.visibility = "hidden";
                }
            }
        }
    function ff()
    {
    showalert2();
    }
    </script></head><body>
    <input type="button" value="fff" onclick="ff()">
    </body>
    </html>
      

  6.   

    不好意思啊。这个帖子是我自己发的,让朋友看的。其实就是关于模拟alert窗口,在8楼里,的代码在IE下是可用的。但是在苹果浏览器里不好用。在4楼的代码主要是现实了在苹果浏览器里可以现实的效果,但是弹出窗口的位置,以及使用方式需要再调整。不好意思,给大家带来困扰了。 
      

  7.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
    <HTML xmlns="http://www.w3.org/1999/xhtml"> <HEAD>
    <META http-equiv=Content-Type content="text/html; charset=utf-8">
    <STYLE type=text/css>HTML {
    BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; OVERFLOW: hidden; HEIGHT: 100%; BORDER-RIGHT-WIDTH: 0px
    }
    BODY {
    FONT-SIZE: 16px; MARGIN: 0px; OVERFLOW: hidden; HEIGHT: 100%
    }
    BUTTON {
    FONT-SIZE: 14px;
    WIDTH: 60px;
    BORDER-RIGHT: #99a8bd 2px solid;
    BORDER-TOP: #99a8bd 1px solid;
    BORDER-LEFT: #99a8bd 1px solid;
    BORDER-BOTTOM: #99a8bd 2px solid;
    }h3 {
        color:white;
    }#mainbody {
    OVERFLOW-Y: scroll; OVERFLOW-X: auto; WIDTH: 100%; HEIGHT: 100%
    }
    #main {
    BACKGROUND: #ccc; MARGIN: 4px; HEIGHT: 2000px
    }
    #transparent {
    DISPLAY: none; BACKGROUND: #fff; FILTER: alpha(opacity=40); WIDTH: 100%; POSITION: absolute; HEIGHT: 100%; opacity: 0.4
    }
    .active#transparent {
    DISPLAY: block
    }
    .absbox {
    DISPLAY: none; BACKGROUND: #fff; POSITION: absolute
    }
    .active {
    DISPLAY: block
    }
    #addnew {
    BORDER-RIGHT:  2px solid;
    BORDER-TOP:  1px solid;
    BORDER-LEFT:  1px solid;
    WIDTH: 360px;
    BORDER-BOTTOM:  2px solid;
    background-color:#CCCCCC;
    }#addnew H3 {
    PADDING-RIGHT: 5px; PADDING-LEFT: 15px; FONT-SIZE: 14px; BACKGROUND: red; PADDING-BOTTOM: 5px; MARGIN: 0px; CURSOR: move; PADDING-TOP: 5px
    }
    #addnew H3 SPAN.fr {
    MARGIN-TOP: -3px; FLOAT: right; CURSOR: pointer
    }
    #addnew H3 BUTTON {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: #e9f2fb; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TABLE {
    BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; MARGIN: 10px 15px 15px; WIDTH: 320px; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TH {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 3px; VERTICAL-ALIGN: top; LINE-HEIGHT: 22px; PADDING-TOP: 3px; HEIGHT: auto; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TD {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 3px; VERTICAL-ALIGN: top; LINE-HEIGHT: 22px; PADDING-TOP: 3px; HEIGHT: auto; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TH {
    FONT-WEIGHT: bold
    }
    #addnew TD {
    WIDTH: 65%
    }
    #addnew INPUT {
    WIDTH: 100%
    }
    #addnew BUTTON {
    LINE-HEIGHT: normal
    }
    #cen_div {
    margin-bottom:10px;
    text-align:center;
    }
    </STYLE><SCRIPT language=javascript type=text/javascript>
    var common={ bind:function(o,ev,fn){
    if (document.all){
    o.attachEvent('on'+ev,fn);
    }
    else{
    o.addEventListener(ev,fn,false);
    }
    return o;
    }, addClass:function (el,cls){
    var arrCls=cls.split(/[ ]+/);
    if(el.className){
    for(var i=0;i <arrCls.length;i++){
    if(el.className.indexOf(arrCls[i])>=0){
    cls=cls.replace(new RegExp('[ ]*'+arrCls[i]+'[ ]*'),' ');
    }
    }
    el.className=[el.className].concat(cls).join(' ');
    }
    else{
    el.className=cls;
    }
    }, removeClass:function (el,cls){
    if(el.className){
    if(el.className.indexOf(cls)>=0){
    el.className=el.className.replace(new RegExp('[ ]*'+cls+'[ ]*','g'),' ');
    }
    }
    }};function init(){
    var drag1=document.getElementById('addnew');
    var drag1bar=drag1.getElementsByTagName('h3')[0];
    new DragObject({module:drag1,handle:drag1bar}); var addnewPop=new Popup({module:drag1,background:document.getElementById('transparent')});
    //document.getElementById('addnew_btnclz').onclick=addnewPop.hide;
    document.getElementById('ok_btn').onclick=addnewPop.hide;
    document.getElementById('test').onclick=addnewPop.show;

    addnewPop.hide();
    }common.bind(window,'load',init);function DragObject(args){
    var module=typeof(args.module)=='string'?document.getElementById(args.module):args.module;
    var handle=typeof(args.handle)=='string'?document.getElementById(args.handle):args.handle; function startDrag(e){
    var e=e||window.event;
    //var elem=e.target||e.srcElement; document.onmousemove=onDrag;
    document.onmouseup=stopDrag;
    module.subX=module.offsetLeft-e.clientX;
    module.subY=module.offsetTop-e.clientY; return false;
    } function onDrag(e){
    e=e||window.event; module.style.left=module.subX+e.clientX+'px';
    module.style.top=module.subY+e.clientY+'px'; return false;
    } function stopDrag(){
    document.onmousemove=null;
    document.onmouseup=null;
    } handle.onmousedown=startDrag;}function Popup(args){
    var module=typeof(args.module)=='string'?document.getElementById(args.module):args.module;
    var background=args.background?(typeof(args.background)=='string'?document.getElementById(args.background):args.background):null; this.show=function(){
    common.addClass(module,'active');
    module.style.left = (window.innerWidth / 2 - module.offsetWidth / 2) + "px";
    module.style.top = (window.innerHeight / 2 - module.offsetHeight / 2) + "px";
    if(background){
    common.addClass(background,'active');
    }
    }; this.hide=function(){
    common.removeClass(module,'active');
    if(background){
    common.removeClass(background,'active');
    }
    };
    }
    </SCRIPT><META content="MSHTML 6.00.2900.3492" name=GENERATOR> </HEAD>
    <BODY><DIV id=absbox>
    <DIV class=active id=transparent> </DIV>
    <DIV class="absbox active" id=addnew>
    <H3> Confirm </H3>
    <br>
    &nbsp;&nbsp;The set value is not proper. Check it.
    <div  id=cen_div>
      <br>
      <BUTTON id=ok_btn>OK </BUTTON>
      <br>
    </div>
    </DIV> </DIV> <a href="#">click</a><input type="button" id="test" value="show box">
    </BODY> </HTML> 
      

  8.   

    看到了。
    主要是通过    document.getElementById('ok_btn').onclick=addnewPop.hide;
        document.getElementById('test').onclick=addnewPop.show;
    这段代码作用的。但是我想问一下:
    如果我在button 上触发一个函数:例如:
    //script
    function ff() 

    function();//这里引用上面的一个函数名。这样可以实现弹出窗口的机制吗?

    //script
    </head> <body> 
    <input type="button" value="fff" onclick="ff()"> 
    </body> 
    </html> 
      

  9.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
    <HTML xmlns="http://www.w3.org/1999/xhtml"> <HEAD>
    <META http-equiv=Content-Type content="text/html; charset=utf-8">
    <STYLE type=text/css>HTML {
    BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; OVERFLOW: hidden; HEIGHT: 100%; BORDER-RIGHT-WIDTH: 0px
    }
    BODY {
    FONT-SIZE: 16px; MARGIN: 0px; OVERFLOW: hidden; HEIGHT: 100%
    }
    BUTTON {
    FONT-SIZE: 14px;
    WIDTH: 60px;
    BORDER-RIGHT: #99a8bd 2px solid;
    BORDER-TOP: #99a8bd 1px solid;
    BORDER-LEFT: #99a8bd 1px solid;
    BORDER-BOTTOM: #99a8bd 2px solid;
    }h3 {
        color:white;
    }#mainbody {
    OVERFLOW-Y: scroll; OVERFLOW-X: auto; WIDTH: 100%; HEIGHT: 100%
    }
    #main {
    BACKGROUND: #ccc; MARGIN: 4px; HEIGHT: 2000px
    }
    #transparent {
    DISPLAY: none; BACKGROUND: #fff; FILTER: alpha(opacity=40); WIDTH: 100%; POSITION: absolute; HEIGHT: 100%; opacity: 0.4
    }
    .active#transparent {
    DISPLAY: block
    }
    .absbox {
    DISPLAY: none; BACKGROUND: #fff; POSITION: absolute
    }
    .active {
    DISPLAY: block
    }
    #addnew {
    BORDER-RIGHT:  2px solid;
    BORDER-TOP:  1px solid;
    BORDER-LEFT:  1px solid;
    WIDTH: 360px;
    BORDER-BOTTOM:  2px solid;
    background-color:#CCCCCC;
    }#addnew H3 {
    PADDING-RIGHT: 5px; PADDING-LEFT: 15px; FONT-SIZE: 14px; BACKGROUND: red; PADDING-BOTTOM: 5px; MARGIN: 0px; CURSOR: move; PADDING-TOP: 5px
    }
    #addnew H3 SPAN.fr {
    MARGIN-TOP: -3px; FLOAT: right; CURSOR: pointer
    }
    #addnew H3 BUTTON {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: #e9f2fb; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TABLE {
    BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; MARGIN: 10px 15px 15px; WIDTH: 320px; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TH {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 3px; VERTICAL-ALIGN: top; LINE-HEIGHT: 22px; PADDING-TOP: 3px; HEIGHT: auto; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TD {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 3px; VERTICAL-ALIGN: top; LINE-HEIGHT: 22px; PADDING-TOP: 3px; HEIGHT: auto; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TH {
    FONT-WEIGHT: bold
    }
    #addnew TD {
    WIDTH: 65%
    }
    #addnew INPUT {
    WIDTH: 100%
    }
    #addnew BUTTON {
    LINE-HEIGHT: normal
    }
    #cen_div {
    margin-bottom:10px;
    text-align:center;
    }
    </STYLE><SCRIPT language=javascript type=text/javascript>
    var common={ bind:function(o,ev,fn){
    if (document.all){
    o.attachEvent('on'+ev,fn);
    }
    else{
    o.addEventListener(ev,fn,false);
    }
    return o;
    }, addClass:function (el,cls){
    var arrCls=cls.split(/[ ]+/);
    if(el.className){
    for(var i=0;i <arrCls.length;i++){
    if(el.className.indexOf(arrCls[i])>=0){
    cls=cls.replace(new RegExp('[ ]*'+arrCls[i]+'[ ]*'),' ');
    }
    }
    el.className=[el.className].concat(cls).join(' ');
    }
    else{
    el.className=cls;
    }
    }, removeClass:function (el,cls){
    if(el.className){
    if(el.className.indexOf(cls)>=0){
    el.className=el.className.replace(new RegExp('[ ]*'+cls+'[ ]*','g'),' ');
    }
    }
    }};function init(){
    var drag1=document.getElementById('addnew');
    var drag1bar=drag1.getElementsByTagName('h3')[0];
    new DragObject({module:drag1,handle:drag1bar}); window.addnewPop=new Popup({module:drag1,background:document.getElementById('transparent')});
    //document.getElementById('addnew_btnclz').onclick=addnewPop.hide;
    document.getElementById('ok_btn').onclick=window.addnewPop.hide;
    //document.getElementById('test').onclick=addnewPop.show;

    addnewPop.hide();
    }common.bind(window,'load',init);function DragObject(args){
    var module=typeof(args.module)=='string'?document.getElementById(args.module):args.module;
    var handle=typeof(args.handle)=='string'?document.getElementById(args.handle):args.handle; function startDrag(e){
    var e=e||window.event;
    //var elem=e.target||e.srcElement; document.onmousemove=onDrag;
    document.onmouseup=stopDrag;
    module.subX=module.offsetLeft-e.clientX;
    module.subY=module.offsetTop-e.clientY; return false;
    } function onDrag(e){
    e=e||window.event; module.style.left=module.subX+e.clientX+'px';
    module.style.top=module.subY+e.clientY+'px'; return false;
    } function stopDrag(){
    document.onmousemove=null;
    document.onmouseup=null;
    } handle.onmousedown=startDrag;}function Popup(args){
    var module=typeof(args.module)=='string'?document.getElementById(args.module):args.module;
    var background=args.background?(typeof(args.background)=='string'?document.getElementById(args.background):args.background):null; this.show=function(){
    common.addClass(module,'active');
    module.style.left = (window.innerWidth / 2 - module.offsetWidth / 2) + "px";
    module.style.top = (window.innerHeight / 2 - module.offsetHeight / 2) + "px";
    if(background){
    common.addClass(background,'active');
    }
    }; this.hide=function(){
    common.removeClass(module,'active');
    if(background){
    common.removeClass(background,'active');
    }
    };
    }
    function testFunction() {
    window.addnewPop.show();
    }
    </SCRIPT><META content="MSHTML 6.00.2900.3492" name=GENERATOR> </HEAD>
    <BODY><DIV id=absbox>
    <DIV class=active id=transparent> </DIV>
    <DIV class="absbox active" id=addnew>
    <H3> Confirm </H3>
    <br>
    &nbsp;&nbsp;The set value is not proper. Check it.
    <div  id=cen_div>
      <br>
      <BUTTON id=ok_btn>OK </BUTTON>
      <br>
    </div>
    </DIV> </DIV> <a href="#">click</a><input type="button" id="test" value="show box" onclick="testFunction();">
    </BODY> </HTML> 
      

  10.   

    小义。我先在问一个问题哈。
    就是弹出框之后,如何让它下面的页面不能被选中啊。<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head >
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><link rel="stylesheet" href="RC_4_50_1.css" type="text/css">
    <STYLE type=text/css>HTML {
    BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; OVERFLOW: hidden; HEIGHT: 100%; BORDER-RIGHT-WIDTH: 0px
    }
    BODY {
    FONT-SIZE: 16px; MARGIN: 0px; OVERFLOW: hidden; HEIGHT: 100%
    }
    BUTTON {
    FONT-SIZE: 14px;
    WIDTH: 60px;
    BORDER-RIGHT: #99a8bd 2px solid;
    BORDER-TOP: #99a8bd 1px solid;
    BORDER-LEFT: #99a8bd 1px solid;
    BORDER-BOTTOM: #99a8bd 2px solid;
    }h3 {
        color:white;
    }#mainbody {
    OVERFLOW-Y: scroll; OVERFLOW-X: auto; WIDTH: 100%; HEIGHT: 100%
    }
    #main {
    BACKGROUND: #ccc; MARGIN: 4px; HEIGHT: 2000px
    }
    #transparent {
    DISPLAY: none; BACKGROUND: #fff; FILTER: alpha(opacity=40); WIDTH: 100%; POSITION: absolute; HEIGHT: 100%; opacity: 0.4
    }
    .active#transparent {
    DISPLAY: block
    }
    .absbox {
    DISPLAY: none; BACKGROUND: #fff; POSITION: absolute
    }
    .active {
    DISPLAY: block
    }
    #addnew {
    BORDER-RIGHT:  2px solid;
    BORDER-TOP:  1px solid;
    BORDER-LEFT:  1px solid;
    WIDTH: 360px;
    BORDER-BOTTOM:  2px solid;
    background-color:#CCCCCC;
    }#addnew H3 {
    PADDING-RIGHT: 5px; PADDING-LEFT: 15px; FONT-SIZE: 14px; BACKGROUND: red; PADDING-BOTTOM: 5px; MARGIN: 0px; CURSOR: move; PADDING-TOP: 5px
    }
    #addnew H3 SPAN.fr {
    MARGIN-TOP: -3px; FLOAT: right; CURSOR: pointer
    }
    #addnew H3 BUTTON {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: #e9f2fb; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TABLE {
    BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; MARGIN: 10px 15px 15px; WIDTH: 320px; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TH {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 3px; VERTICAL-ALIGN: top; LINE-HEIGHT: 22px; PADDING-TOP: 3px; HEIGHT: auto; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TD {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 3px; VERTICAL-ALIGN: top; LINE-HEIGHT: 22px; PADDING-TOP: 3px; HEIGHT: auto; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TH {
    FONT-WEIGHT: bold
    }
    #addnew TD {
    WIDTH: 65%
    }
    #addnew INPUT {
    WIDTH: 100%
    }
    #addnew BUTTON {
    LINE-HEIGHT: normal
    }
    #cen_div {
    margin-bottom:10px;
    text-align:center;
    }
    </STYLE><SCRIPT language=javascript type=text/javascript>
    var common={    bind:function(o,ev,fn){
            if (document.all){
                o.attachEvent('on'+ev,fn);
            }
            else{
                o.addEventListener(ev,fn,false);
            }
            return o;
        },    addClass:function (el,cls){
            var arrCls=cls.split(/[ ]+/);
            if(el.className){
                for(var i=0;i <arrCls.length;i++){
                    if(el.className.indexOf(arrCls[i])>=0){
                        cls=cls.replace(new RegExp('[ ]*'+arrCls[i]+'[ ]*'),' ');
                    }
                }
                el.className=[el.className].concat(cls).join(' ');
            }
            else{
                el.className=cls;
            }
        },    removeClass:function (el,cls){
            if(el.className){
                if(el.className.indexOf(cls)>=0){
                    el.className=el.className.replace(new RegExp('[ ]*'+cls+'[ ]*','g'),' ');
                }
            }
        }};function init(){
        var drag1=document.getElementById('addnew');
        var drag1bar=drag1.getElementsByTagName('h3')[0];
        new DragObject({module:drag1,handle:drag1bar});    window.addnewPop=new Popup({module:drag1,background:document.getElementById('transparent')});
        //document.getElementById('addnew_btnclz').onclick=addnewPop.hide;
        document.getElementById('ok_btn').onclick=window.addnewPop.hide;
        //document.getElementById('test').onclick=addnewPop.show;
        
        addnewPop.hide();
    }common.bind(window,'load',init);function DragObject(args){
        var module=typeof(args.module)=='string'?document.getElementById(args.module):args.module;
        var handle=typeof(args.handle)=='string'?document.getElementById(args.handle):args.handle;    function startDrag(e){
            var e=e||window.event;
            //var elem=e.target||e.srcElement;        document.onmousemove=onDrag;
            document.onmouseup=stopDrag;
            module.subX=module.offsetLeft-e.clientX;
            module.subY=module.offsetTop-e.clientY;        return false;
        }    function onDrag(e){
            e=e||window.event;        module.style.left=module.subX+e.clientX+'px';
            module.style.top=module.subY+e.clientY+'px';        return false;
        }    function stopDrag(){
            document.onmousemove=null;
            document.onmouseup=null;
        }    handle.onmousedown=startDrag;}function Popup(args){
        var module=typeof(args.module)=='string'?document.getElementById(args.module):args.module;
        var background=args.background?(typeof(args.background)=='string'?document.getElementById(args.background):args.background):null;    this.show=function(){
            common.addClass(module,'active');
            module.style.left = (window.innerWidth / 2 - module.offsetWidth / 2) + "px";
            module.style.top = (window.innerHeight / 2 - module.offsetHeight / 2) + "px";
            if(background){
                common.addClass(background,'active');
            }
        };    this.hide=function(){
            common.removeClass(module,'active');
            if(background){
                common.removeClass(background,'active');
            }
        };
    }
    function testFunction() {
        window.addnewPop.show();
    }
    </SCRIPT>
    <script language="JavaScript" src="RC_4_50_1.js"></script>
    </head>
    <body bgcolor="#FFFFFF" >
    <div class="maintop">
    <ul>
    <li class="maintop_yellow">
    <ul>
    <li>
    <div class ="TitleText" id="SA_RC4501_lalHeadMsg">111<a href="./RC_4_50.phtml"><?php echo _("C-1145");?></a>>22</div>
    </li>
    </ul>
    </li>
    </ul>
    </div>
    <div class="maincenter_text" >
    <div id="SA_div1">
    <table class="table_input">
    <tr>
    <td>12
    </td>
    </tr>
    <tr>
    <td>
    <input type="text" id="SA_RC4501_txt1" onkeyup="SA_oncheckBtn()" oncontextmenu="window.event.returnValue=false" maxlength="256"/>
    </td>
    </tr>
    </table>

    <table class="table_input2">
    <tr>
    <td>23
    </td>
    </tr>
    <tr>
    <td>
    <input type="text" id="SA_RC4501_txt2" onkeyup="SA_oncheckBtn()" oncontextmenu="window.event.returnValue=false" maxlength="10"/>
    </td>
    <td>
    <label>222</label>
    </td>
    </tr>
    </table>

    <table class="table_input2">
    <tr>
    <td>333
    </td>
    </tr>
    <tr>
    <td>
    <select>
    </select>
    </td>
    </tr>
    </table>
    </div>
    <div class="div_bottom">
    <div>
    <input type="button" id="SA_RC4501_btnOK" onclick="SA_sendDataByServer()" value="ok" class="btn" disabled>
    <input type="button" id="SA_RC4501_btnCancel" onclick="SA_RC_4_50_Url()" value="cab" class="btn" >
    </div>
    </div>
    </form>
    </div>
    <DIV id=absbox>
    <DIV class=active id=transparent> </DIV>
    <DIV class="absbox active" id=addnew>
    <H3> Confirm </H3>
    <br>
    &nbsp;&nbsp;The set value is not proper. Check it.
    <div  id=cen_div>
      <br>
      <BUTTON id=ok_btn>OK </BUTTON>
      <br>
    </div>
    </DIV> </DIV> </body>
    </html>
      

  11.   

    如果要是有text框的话,就可以点击了。我想用什么过滤处理,不能对下面的页面进行操作,改如何处理那?
      

  12.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head >
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><link rel="stylesheet" href="RC_4_50_1.css" type="text/css">
    <STYLE type=text/css>HTML {
    BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; OVERFLOW: hidden; HEIGHT: 100%; BORDER-RIGHT-WIDTH: 0px
    }
    BODY {
    FONT-SIZE: 16px; MARGIN: 0px; OVERFLOW: hidden; HEIGHT: 100%
    }
    BUTTON {
    FONT-SIZE: 14px;
    WIDTH: 60px;
    BORDER-RIGHT: #99a8bd 2px solid;
    BORDER-TOP: #99a8bd 1px solid;
    BORDER-LEFT: #99a8bd 1px solid;
    BORDER-BOTTOM: #99a8bd 2px solid;
    }h3 {
        color:white;
    }#mainbody {
    OVERFLOW-Y: scroll; OVERFLOW-X: auto; WIDTH: 100%; HEIGHT: 100%
    }
    #main {
    BACKGROUND: #ccc; MARGIN: 4px; HEIGHT: 2000px
    }
    #transparent {
    DISPLAY: none; BACKGROUND: #fff; FILTER: alpha(opacity=40); WIDTH: 100%; POSITION: absolute; HEIGHT: 100%; opacity: 0.4
    }
    .active#transparent {
    DISPLAY: block
    }
    .absbox {
    DISPLAY: none; BACKGROUND: #fff; POSITION: absolute
    }
    .active {
    DISPLAY: block
    }
    #addnew {
    BORDER-RIGHT:  2px solid;
    BORDER-TOP:  1px solid;
    BORDER-LEFT:  1px solid;
    WIDTH: 360px;
    BORDER-BOTTOM:  2px solid;
    background-color:#CCCCCC;
    }#addnew H3 {
    PADDING-RIGHT: 5px; PADDING-LEFT: 15px; FONT-SIZE: 14px; BACKGROUND: red; PADDING-BOTTOM: 5px; MARGIN: 0px; CURSOR: move; PADDING-TOP: 5px
    }
    #addnew H3 SPAN.fr {
    MARGIN-TOP: -3px; FLOAT: right; CURSOR: pointer
    }
    #addnew H3 BUTTON {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: #e9f2fb; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TABLE {
    BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; MARGIN: 10px 15px 15px; WIDTH: 320px; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TH {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 3px; VERTICAL-ALIGN: top; LINE-HEIGHT: 22px; PADDING-TOP: 3px; HEIGHT: auto; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TD {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 3px; VERTICAL-ALIGN: top; LINE-HEIGHT: 22px; PADDING-TOP: 3px; HEIGHT: auto; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TH {
    FONT-WEIGHT: bold
    }
    #addnew TD {
    WIDTH: 65%
    }
    #addnew INPUT {
    WIDTH: 100%
    }
    #addnew BUTTON {
    LINE-HEIGHT: normal
    }
    #cen_div {
    margin-bottom:10px;
    text-align:center;
    }
    </STYLE><SCRIPT language=javascript type=text/javascript>
    var common={    bind:function(o,ev,fn){
            if (document.all){
                o.attachEvent('on'+ev,fn);
            }
            else{
                o.addEventListener(ev,fn,false);
            }
            return o;
        },    addClass:function (el,cls){
            var arrCls=cls.split(/[ ]+/);
            if(el.className){
                for(var i=0;i <arrCls.length;i++){
                    if(el.className.indexOf(arrCls[i])>=0){
                        cls=cls.replace(new RegExp('[ ]*'+arrCls[i]+'[ ]*'),' ');
                    }
                }
                el.className=[el.className].concat(cls).join(' ');
            }
            else{
                el.className=cls;
            }
        },    removeClass:function (el,cls){
            if(el.className){
                if(el.className.indexOf(cls)>=0){
                    el.className=el.className.replace(new RegExp('[ ]*'+cls+'[ ]*','g'),' ');
                }
            }
        }};function init(){
        var drag1=document.getElementById('addnew');
        var drag1bar=drag1.getElementsByTagName('h3')[0];
        new DragObject({module:drag1,handle:drag1bar});    window.addnewPop=new Popup({module:drag1,background:document.getElementById('transparent')});
        //document.getElementById('addnew_btnclz').onclick=addnewPop.hide;
        document.getElementById('ok_btn').onclick=window.addnewPop.hide;
        //document.getElementById('test').onclick=addnewPop.show;
       
        addnewPop.hide();
    }common.bind(window,'load',init);function DragObject(args){
        var module=typeof(args.module)=='string'?document.getElementById(args.module):args.module;
        var handle=typeof(args.handle)=='string'?document.getElementById(args.handle):args.handle;    function startDrag(e){
            var e=e||window.event;
            //var elem=e.target||e.srcElement;        document.onmousemove=onDrag;
            document.onmouseup=stopDrag;
            module.subX=module.offsetLeft-e.clientX;
            module.subY=module.offsetTop-e.clientY;        return false;
        }    function onDrag(e){
            e=e||window.event;        module.style.left=module.subX+e.clientX+'px';
            module.style.top=module.subY+e.clientY+'px';        return false;
        }    function stopDrag(){
            document.onmousemove=null;
            document.onmouseup=null;
        }    handle.onmousedown=startDrag;}function Popup(args){
        var module=typeof(args.module)=='string'?document.getElementById(args.module):args.module;
        var background=args.background?(typeof(args.background)=='string'?document.getElementById(args.background):args.background):null;    this.show=function(){
            common.addClass(module,'active');
            module.style.left = (window.innerWidth / 2 - module.offsetWidth / 2) + "px";
            module.style.top = (window.innerHeight / 2 - module.offsetHeight / 2) + "px";
            if(background){
                common.addClass(background,'active');
            }
        };    this.hide=function(){
            common.removeClass(module,'active');
            if(background){
                common.removeClass(background,'active');
            }
        };
    }
    function testFunction() {
        window.addnewPop.show();
    }
    </SCRIPT>
    <script language="JavaScript" src="RC_4_50_1.js"> </script>
    </head>
    <body bgcolor="#FFFFFF" >
    <!-- put this code segment here -->
    <DIV id=absbox>
    <DIV class=active id=transparent> </DIV>
    <DIV class="absbox active" id=addnew>
    <H3> Confirm </H3>
    <br>
    &nbsp;&nbsp;The set value is not proper. Check it.
    <div  id=cen_div>
      <br>
      <BUTTON id=ok_btn>OK </BUTTON>
      <br>
    </div>
    </DIV> </DIV><!-- code segment --><div class="maintop">
    <ul>
    <li class="maintop_yellow">
    <ul>
    <li>
    <div class ="TitleText" id="SA_RC4501_lalHeadMsg">111 <a href="./RC_4_50.phtml"> <?php echo _("C-1145");?> </a>>22 </div>
    </li>
    </ul>
    </li>
    </ul>
    </div>
    <div class="maincenter_text" >
    <div id="SA_div1">
    <table class="table_input">
    <tr>
    <td>12
    </td>
    </tr>
    <tr>
    <td>
    <input type="text" id="SA_RC4501_txt1" onkeyup="SA_oncheckBtn()" oncontextmenu="window.event.returnValue=false" maxlength="256"/>
    </td>
    </tr>
    </table><table class="table_input2">
    <tr>
    <td>23
    </td>
    </tr>
    <tr>
    <td>
    <input type="text" id="SA_RC4501_txt2" onkeyup="SA_oncheckBtn()" oncontextmenu="window.event.returnValue=false" maxlength="10"/>
    </td>
    <td>
    <label>222 </label>
    </td>
    </tr>
    </table><table class="table_input2">
    <tr>
    <td>333
    </td>
    </tr>
    <tr>
    <td>
    <select>
    </select>
    </td>
    </tr>
    </table>
    </div>
    <div class="div_bottom">
    <div>
    <input type="button" id="SA_RC4501_btnOK" onclick="testFunction()" value="ok" class="btn">
    <input type="button" id="SA_RC4501_btnCancel" onclick="SA_RC_4_50_Url()" value="cab" class="btn" >
    </div>
    </div>
    </form>
    </div></body>
    </html> 
      

  13.   

    再次请教。
    目前隐藏还有一个小问题,
    目前隐藏的面积应该是获取当前窗口的长和宽进行隐藏,这样就造成,如果把当前窗口缩小,就只隐藏当前页面区域的面积。其他页面区域仍不被隐藏
    我看代码没看到在哪里执行隐藏的部分,我想应该获取当前页面的长和宽进行隐藏,这样就可以了。
    例子代码如下,帮我一下丫~~<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head >
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><link rel="stylesheet" href="RC_4_50_1.css" type="text/css">
    <STYLE type=text/css>HTML {
    BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; OVERFLOW: hidden; HEIGHT: 100%; BORDER-RIGHT-WIDTH: 0px
    }
    BODY {
    FONT-SIZE: 16px; MARGIN: 0px; HEIGHT: 100%
    }
    BUTTON {
    FONT-SIZE: 14px;
    WIDTH: 60px;
    BORDER-RIGHT: #99a8bd 2px solid;
    BORDER-TOP: #99a8bd 1px solid;
    BORDER-LEFT: #99a8bd 1px solid;
    BORDER-BOTTOM: #99a8bd 2px solid;
    }h3 {
        color:white;
    }#mainbody {
    OVERFLOW-Y: scroll; OVERFLOW-X: auto; WIDTH: 100%; HEIGHT: 100%
    }
    #main {
    BACKGROUND: #ccc; MARGIN: 4px; HEIGHT: 2000px
    }
    #transparent {
    DISPLAY: none; BACKGROUND: #fff; FILTER: alpha(opacity=40); WIDTH: 100%; POSITION: absolute; HEIGHT: 100%; opacity: 0.4
    }
    .active#transparent {
    DISPLAY: block
    }
    .absbox {
    DISPLAY: none; BACKGROUND: #fff; POSITION: absolute
    }
    .active {
    DISPLAY: block
    }
    #addnew {
    BORDER-RIGHT:  2px solid;
    BORDER-TOP:  1px solid;
    BORDER-LEFT:  1px solid;
    WIDTH: 360px;
    BORDER-BOTTOM:  2px solid;
    background-color:#CCCCCC;
    }#addnew H3 {
    PADDING-RIGHT: 5px; PADDING-LEFT: 15px; FONT-SIZE: 14px; BACKGROUND: red; PADDING-BOTTOM: 5px; MARGIN: 0px; CURSOR: move; PADDING-TOP: 5px
    }
    #addnew H3 SPAN.fr {
    MARGIN-TOP: -3px; FLOAT: right; CURSOR: pointer
    }
    #addnew H3 BUTTON {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: #e9f2fb; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TABLE {
    BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; MARGIN: 10px 15px 15px; WIDTH: 320px; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TH {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 3px; VERTICAL-ALIGN: top; LINE-HEIGHT: 22px; PADDING-TOP: 3px; HEIGHT: auto; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TD {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 3px; VERTICAL-ALIGN: top; LINE-HEIGHT: 22px; PADDING-TOP: 3px; HEIGHT: auto; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TH {
    FONT-WEIGHT: bold
    }
    #addnew TD {
    WIDTH: 65%
    }
    #addnew INPUT {
    WIDTH: 100%
    }
    #addnew BUTTON {
    LINE-HEIGHT: normal
    }
    #cen_div {
    margin-bottom:10px;
    text-align:center;
    }
    </STYLE><SCRIPT language=javascript type=text/javascript>
    var common={    bind:function(o,ev,fn){
            if (document.all){
                o.attachEvent('on'+ev,fn);
            }
            else{
                o.addEventListener(ev,fn,false);
            }
            return o;
        },    addClass:function (el,cls){
            var arrCls=cls.split(/[ ]+/);
            if(el.className){
                for(var i=0;i <arrCls.length;i++){
                    if(el.className.indexOf(arrCls[i])>=0){
                        cls=cls.replace(new RegExp('[ ]*'+arrCls[i]+'[ ]*'),' ');
                    }
                }
                el.className=[el.className].concat(cls).join(' ');
            }
            else{
                el.className=cls;
            }
        },    removeClass:function (el,cls){
            if(el.className){
                if(el.className.indexOf(cls)>=0){
                    el.className=el.className.replace(new RegExp('[ ]*'+cls+'[ ]*','g'),' ');
                }
            }
        }};function init(){
        var drag1=document.getElementById('addnew');
        var drag1bar=drag1.getElementsByTagName('h3')[0];
        new DragObject({module:drag1,handle:drag1bar});    window.addnewPop=new Popup({module:drag1,background:document.getElementById('transparent')});
        //document.getElementById('addnew_btnclz').onclick=addnewPop.hide;
        document.getElementById('ok_btn').onclick=window.addnewPop.hide;
        //document.getElementById('test').onclick=addnewPop.show;
        
        addnewPop.hide();
    }common.bind(window,'load',init);function DragObject(args){
        var module=typeof(args.module)=='string'?document.getElementById(args.module):args.module;
        var handle=typeof(args.handle)=='string'?document.getElementById(args.handle):args.handle;    function startDrag(e){
            var e=e||window.event;
            //var elem=e.target||e.srcElement;        document.onmousemove=onDrag;
            document.onmouseup=stopDrag;
            module.subX=module.offsetLeft-e.clientX;
            module.subY=module.offsetTop-e.clientY;        return false;
        }    function onDrag(e){
            e=e||window.event;        module.style.left=module.subX+e.clientX+'px';
            module.style.top=module.subY+e.clientY+'px';        return false;
        }    function stopDrag(){
            document.onmousemove=null;
            document.onmouseup=null;
        }    handle.onmousedown=startDrag;}function Popup(args){
        var module=typeof(args.module)=='string'?document.getElementById(args.module):args.module;
        var background=args.background?(typeof(args.background)=='string'?document.getElementById(args.background):args.background):null;    this.show=function(){
            common.addClass(module,'active');
            module.style.left = (window.innerWidth / 2 - module.offsetWidth / 2) + "px";
            module.style.top = (window.innerHeight / 2 - module.offsetHeight / 2) + "px";
            if(background){
                common.addClass(background,'active');
            }
        };    this.hide=function(){
            common.removeClass(module,'active');
            if(background){
                common.removeClass(background,'active');
            }
        };
    }
    function testFunction() {
        window.addnewPop.show();
    }
    </SCRIPT>
    <script language="JavaScript" src="RC_4_50_1.js"></script>
    </head>
    <body bgcolor="#FFFFFF" >
    <DIV id=absbox>
    <DIV class=active id=transparent> </DIV>
    <DIV class="absbox active" id=addnew>
    <H3> Confirm </H3>
    <br>
    &nbsp;&nbsp;The set value is not proper. Check it.
    <div  id=cen_div>
      <br>
      <BUTTON id=ok_btn>OK </BUTTON>
      <br>
    </div>
    </DIV> </DIV> 
    <div class="maintop">
    <ul>
    <li class="maintop_yellow">
    <ul>
    <li>
    <div class ="TitleText" id="SA_RC4501_lalHeadMsg">111<a href="./RC_4_50.phtml"><?php echo _("C-1145");?></a>>22</div>
    </li>
    </ul>
    </li>
    </ul>
    </div>
    <div class="maincenter_text" >
    <div id="SA_div1">
    <table class="table_input">
    <tr>
    <td>12
    </td>
    </tr>
    <tr>
    <td>
    <input type="text" id="SA_RC4501_txt1" onkeyup="SA_oncheckBtn()" oncontextmenu="window.event.returnValue=false" maxlength="256"/>
    </td>
    </tr>
    </table>

    <table class="table_input2">
    <tr>
    <td>23
    </td>
    </tr>
    <tr>
    <td>
    <input type="text" id="SA_RC4501_txt2" onkeyup="SA_oncheckBtn()" oncontextmenu="window.event.returnValue=false" maxlength="10"/>
    </td>
    <td>
    <label>222</label>
    </td>
    </tr>
    </table>

    <table class="table_input2">
    <tr>
    <td>333
    </td>
    </tr>
    <tr>
    <td>
    <select>
    </select>
    </td>
    </tr>
    </table>
    </div>
    <div class="div_bottom">
    <div>
    <input type="button" id="SA_RC4501_btnOK" onclick="SA_sendDataByServer()" value="ok" class="btn" disabled>
    <input type="button" id="SA_RC4501_btnCancel" onclick="SA_RC_4_50_Url()" value="cab" class="btn" >
    </div>
    </div>
    </form>
    </div><br>
    <br><br>
    <br>
    <br>
    <br><br>
    <br>
    <br>
    <br><br>
    <br>
    <input type="text" id="SA_RC4501_txt1" onkeyup="SA_oncheckBtn()" oncontextmenu="window.event.returnValue=false" maxlength="256"/>
    </body>
    </html>
      

  14.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head >
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><link rel="stylesheet" href="RC_4_50_1.css" type="text/css">
    <STYLE type=text/css>HTML {
    BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; OVERFLOW: hidden; HEIGHT: 100%; BORDER-RIGHT-WIDTH: 0px
    }
    BODY {
    FONT-SIZE: 16px; MARGIN: 0px; HEIGHT: 100%
    }
    BUTTON {
    FONT-SIZE: 14px;
    WIDTH: 60px;
    BORDER-RIGHT: #99a8bd 2px solid;
    BORDER-TOP: #99a8bd 1px solid;
    BORDER-LEFT: #99a8bd 1px solid;
    BORDER-BOTTOM: #99a8bd 2px solid;
    }h3 {
        color:white;
    }#mainbody {
    OVERFLOW-Y: scroll; OVERFLOW-X: auto; WIDTH: 100%; HEIGHT: 100%
    }
    #main {
    BACKGROUND: #ccc; MARGIN: 4px; HEIGHT: 2000px
    }
    #transparent {
    DISPLAY: none; BACKGROUND: #fff; FILTER: alpha(opacity=40); WIDTH: 100%; POSITION: absolute; HEIGHT: 100%; opacity: 0.4
    }
    .active#transparent {
    DISPLAY: block
    }
    .absbox {
    DISPLAY: none; BACKGROUND: #fff; POSITION: absolute
    }
    .active {
    DISPLAY: block
    }
    #addnew {
    BORDER-RIGHT:  2px solid;
    BORDER-TOP:  1px solid;
    BORDER-LEFT:  1px solid;
    WIDTH: 360px;
    BORDER-BOTTOM:  2px solid;
    background-color:#CCCCCC;
    }#addnew H3 {
    PADDING-RIGHT: 5px; PADDING-LEFT: 15px; FONT-SIZE: 14px; BACKGROUND: red; PADDING-BOTTOM: 5px; MARGIN: 0px; CURSOR: move; PADDING-TOP: 5px
    }
    #addnew H3 SPAN.fr {
    MARGIN-TOP: -3px; FLOAT: right; CURSOR: pointer
    }
    #addnew H3 BUTTON {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: #e9f2fb; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TABLE {
    BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; MARGIN: 10px 15px 15px; WIDTH: 320px; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TH {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 3px; VERTICAL-ALIGN: top; LINE-HEIGHT: 22px; PADDING-TOP: 3px; HEIGHT: auto; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TD {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 3px; VERTICAL-ALIGN: top; LINE-HEIGHT: 22px; PADDING-TOP: 3px; HEIGHT: auto; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TH {
    FONT-WEIGHT: bold
    }
    #addnew TD {
    WIDTH: 65%
    }
    #addnew INPUT {
    WIDTH: 100%
    }
    #addnew BUTTON {
    LINE-HEIGHT: normal
    }
    #cen_div {
    margin-bottom:10px;
    text-align:center;
    }
    </STYLE><SCRIPT language=javascript type=text/javascript>
    var common={    bind:function(o,ev,fn){
            if (document.all){
                o.attachEvent('on'+ev,fn);
            }
            else{
                o.addEventListener(ev,fn,false);
            }
            return o;
        },    addClass:function (el,cls){
            var arrCls=cls.split(/[ ]+/);
            if(el.className){
                for(var i=0;i <arrCls.length;i++){
                    if(el.className.indexOf(arrCls[i])>=0){
                        cls=cls.replace(new RegExp('[ ]*'+arrCls[i]+'[ ]*'),' ');
                    }
                }
                el.className=[el.className].concat(cls).join(' ');
            }
            else{
                el.className=cls;
            }
        },    removeClass:function (el,cls){
            if(el.className){
                if(el.className.indexOf(cls)>=0){
                    el.className=el.className.replace(new RegExp('[ ]*'+cls+'[ ]*','g'),' ');
                }
            }
        }};function init(){
        var drag1=document.getElementById('addnew');
        var drag1bar=drag1.getElementsByTagName('h3')[0];
        new DragObject({module:drag1,handle:drag1bar});    window.addnewPop=new Popup({module:drag1,background:document.getElementById('transparent')});
        //document.getElementById('addnew_btnclz').onclick=addnewPop.hide;
        document.getElementById('ok_btn').onclick=window.addnewPop.hide;
        //document.getElementById('test').onclick=addnewPop.show;
       
        addnewPop.hide();
    }common.bind(window,'load',init);function DragObject(args){
        var module=typeof(args.module)=='string'?document.getElementById(args.module):args.module;
        var handle=typeof(args.handle)=='string'?document.getElementById(args.handle):args.handle;    function startDrag(e){
            var e=e||window.event;
            //var elem=e.target||e.srcElement;        document.onmousemove=onDrag;
            document.onmouseup=stopDrag;
            module.subX=module.offsetLeft-e.clientX;
            module.subY=module.offsetTop-e.clientY;        return false;
        }    function onDrag(e){
            e=e||window.event;        module.style.left=module.subX+e.clientX+'px';
            module.style.top=module.subY+e.clientY+'px';        return false;
        }    function stopDrag(){
            document.onmousemove=null;
            document.onmouseup=null;
        }    handle.onmousedown=startDrag;}function Popup(args){
        var module=typeof(args.module)=='string'?document.getElementById(args.module):args.module;
        var background=args.background?(typeof(args.background)=='string'?document.getElementById(args.background):args.background):null;    this.show=function(){
            common.addClass(module,'active');
            module.style.left = (window.innerWidth / 2 - module.offsetWidth / 2) + "px";
            module.style.top = (window.innerHeight / 2 - module.offsetHeight / 2) + "px";
            if(background){
                common.addClass(background,'active');
    background.style.width = document.body.scrollWidth + 'px';
    background.style.height = document.body.scrollHeight + 'px';
            }
        };    this.hide=function(){
            common.removeClass(module,'active');
            if(background){
                common.removeClass(background,'active');
            }
        };
    }
    function testFunction() {
        window.addnewPop.show();
    }
    </SCRIPT>
    <script language="JavaScript" src="RC_4_50_1.js"> </script>
    </head>
    <body bgcolor="#FFFFFF" >
    <DIV id=absbox>
    <DIV class=active id=transparent> </DIV>
    <DIV class="absbox active" id=addnew>
    <H3> Confirm </H3>
    <br>
    &nbsp;&nbsp;The set value is not proper. Check it.
    <div  id=cen_div>
      <br>
      <BUTTON id=ok_btn>OK </BUTTON>
      <br>
    </div>
    </DIV> </DIV>
    <div class="maintop">
    <ul>
    <li class="maintop_yellow">
    <ul>
    <li>
    <div class ="TitleText" id="SA_RC4501_lalHeadMsg">111 <a href="./RC_4_50.phtml"> <?php echo _("C-1145");?> </a>>22 </div>
    </li>
    </ul>
    </li>
    </ul>
    </div>
    <div class="maincenter_text" >
    <div id="SA_div1">
    <table class="table_input">
    <tr>
    <td>12
    </td>
    </tr>
    <tr>
    <td>
    <input type="text" id="SA_RC4501_txt1" onkeyup="SA_oncheckBtn()" oncontextmenu="window.event.returnValue=false" maxlength="256"/>
    </td>
    </tr>
    </table><table class="table_input2">
    <tr>
    <td>23
    </td>
    </tr>
    <tr>
    <td>
    <input type="text" id="SA_RC4501_txt2" onkeyup="SA_oncheckBtn()" oncontextmenu="window.event.returnValue=false" maxlength="10"/>
    </td>
    <td>
    <label>222 </label>
    </td>
    </tr>
    </table><table class="table_input2">
    <tr>
    <td>333
    </td>
    </tr>
    <tr>
    <td>
    <select>
    </select>
    </td>
    </tr>
    </table>
    </div>
    <div class="div_bottom">
    <div>
    <input type="button" id="SA_RC4501_btnOK" onclick="SA_sendDataByServer()" value="ok" class="btn" disabled>
    <input type="button" id="SA_RC4501_btnCancel" onclick="SA_RC_4_50_Url()" value="cab" class="btn" >
    </div>
    </div>
    </form>
    </div><br>
    <br><br>
    <br>
    <br>
    <br><br>
    <br>
    <br>
    <br><br>
    <br>
    <input type="text" id="SA_RC4501_txt1" onkeyup="SA_oncheckBtn()" oncontextmenu="window.event.returnValue=false" maxlength="256"/>
    </body>
    </html> 
      

  15.   

    新增问题
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    <html> 
    <head > 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <STYLE type=text/css>HTML { 
    BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; OVERFLOW: hidden; HEIGHT: 100%; BORDER-RIGHT-WIDTH: 0px 

    BODY { 
    FONT-SIZE: 16px; MARGIN: 0px; HEIGHT: 100% 

    BUTTON { 
    FONT-SIZE: 14px; 
    WIDTH: 60px; 
    BORDER-RIGHT: #99a8bd 2px solid; 
    BORDER-TOP: #99a8bd 1px solid; 
    BORDER-LEFT: #99a8bd 1px solid; 
    BORDER-BOTTOM: #99a8bd 2px solid; 
    } h3 { 
        color:white; 
    } #mainbody { 
    OVERFLOW-Y: scroll; OVERFLOW-X: auto; WIDTH: 100%; HEIGHT: 100% 

    #main { 
    BACKGROUND: #ccc; MARGIN: 4px; HEIGHT: 2000px 

    #transparent { 
    DISPLAY: none; BACKGROUND: #fff; FILTER: alpha(opacity=40); WIDTH: 100%; POSITION: absolute; HEIGHT: 100%; opacity: 0.4 

    .active#transparent { 
    DISPLAY: block 

    .absbox { 
    DISPLAY: none; BACKGROUND: #fff; POSITION: absolute 

    .active { 
    DISPLAY: block 

    #addnew { 
    BORDER-RIGHT:  2px solid; 
    BORDER-TOP:  1px solid; 
    BORDER-LEFT:  1px solid; 
    WIDTH: 360px; 
    BORDER-BOTTOM:  2px solid; 
    background-color:#CCCCCC; 
    } #addnew H3 { 
    PADDING-RIGHT: 5px; PADDING-LEFT: 15px; FONT-SIZE: 14px; BACKGROUND: red; PADDING-BOTTOM: 5px; MARGIN: 0px; CURSOR: move; PADDING-TOP: 5px 

    #addnew H3 SPAN.fr { 
    MARGIN-TOP: -3px; FLOAT: right; CURSOR: pointer 

    #addnew H3 BUTTON { 
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: #e9f2fb; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px 

    #addnew TABLE { 
    BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; MARGIN: 10px 15px 15px; WIDTH: 320px; BORDER-RIGHT-WIDTH: 0px 

    #addnew TH { 
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 3px; VERTICAL-ALIGN: top; LINE-HEIGHT: 22px; PADDING-TOP: 3px; HEIGHT: auto; BORDER-RIGHT-WIDTH: 0px 

    #addnew TD { 
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 3px; VERTICAL-ALIGN: top; LINE-HEIGHT: 22px; PADDING-TOP: 3px; HEIGHT: auto; BORDER-RIGHT-WIDTH: 0px 

    #addnew TH { 
    FONT-WEIGHT: bold 

    #addnew TD { 
    WIDTH: 65% 

    #addnew INPUT { 
    WIDTH: 100% 

    #addnew BUTTON { 
    LINE-HEIGHT: normal 

    #cen_div { 
    margin-bottom:10px; 
    text-align:center; 
    } .btnUp1 {
    position: absolute;
    MARGIN-TOP: 1px;
    width: 18px;
    height: 10px;
    left: 41px;
    top: 1px;
    }
    .btnDown1 {
    position: absolute;
    width: 18px;
    height: 10px;
    left: 41px;
    top: 10px;
    }
    .inputstyle {
    MARGIN-LEFT: 100px;
    }
    </STYLE> <SCRIPT language=javascript type=text/javascript> 
    var common={     bind:function(o,ev,fn){ 
            if (document.all){ 
                o.attachEvent('on'+ev,fn); 
            } 
            else{ 
                o.addEventListener(ev,fn,false); 
            } 
            return o; 
        },     addClass:function (el,cls){ 
            var arrCls=cls.split(/[ ]+/); 
            if(el.className){ 
                for(var i=0;i <arrCls.length;i++){ 
                    if(el.className.indexOf(arrCls[i])>=0){ 
                        cls=cls.replace(new RegExp('[ ]*'+arrCls[i]+'[ ]*'),' '); 
                    } 
                } 
                el.className=[el.className].concat(cls).join(' '); 
            } 
            else{ 
                el.className=cls; 
            } 
        },     removeClass:function (el,cls){ 
            if(el.className){ 
                if(el.className.indexOf(cls)>=0){ 
                    el.className=el.className.replace(new RegExp('[ ]*'+cls+'[ ]*','g'),' '); 
                } 
            } 
        } }; function init(){ 
        var drag1=document.getElementById('addnew'); 
        var drag1bar=drag1.getElementsByTagName('h3')[0]; 
        new DragObject({module:drag1,handle:drag1bar});     window.addnewPop=new Popup({module:drag1,background:document.getElementById('transparent')}); 
        //document.getElementById('addnew_btnclz').onclick=addnewPop.hide; 
        document.getElementById('ok_btn').onclick=window.addnewPop.hide; 
        //document.getElementById('test').onclick=addnewPop.show; 
      
        addnewPop.hide(); 
    } common.bind(window,'load',init); function DragObject(args){ 
        var module=typeof(args.module)=='string'?document.getElementById(args.module):args.module; 
        var handle=typeof(args.handle)=='string'?document.getElementById(args.handle):args.handle;     function startDrag(e){ 
            var e=e||window.event; 
            //var elem=e.target||e.srcElement;         document.onmousemove=onDrag; 
            document.onmouseup=stopDrag; 
            module.subX=module.offsetLeft-e.clientX; 
            module.subY=module.offsetTop-e.clientY;         return false; 
        }     function onDrag(e){ 
            e=e||window.event;         module.style.left=module.subX+e.clientX+'px'; 
            module.style.top=module.subY+e.clientY+'px';         return false; 
        }     function stopDrag(){ 
            document.onmousemove=null; 
            document.onmouseup=null; 
        }     handle.onmousedown=startDrag; } function Popup(args){ 
        var module=typeof(args.module)=='string'?document.getElementById(args.module):args.module; 
        var background=args.background?(typeof(args.background)=='string'?document.getElementById(args.background):args.background):null;     this.show=function(){ 
            common.addClass(module,'active'); 
            module.style.left = (window.innerWidth / 2 - module.offsetWidth / 2) + "px"; 
            module.style.top = (window.innerHeight / 2 - module.offsetHeight / 2) + "px"; 
            if(background){ 
                common.addClass(background,'active'); 
    background.style.width = document.body.scrollWidth + 'px'; 
    background.style.height = document.body.scrollHeight + 'px'; 
            } 
        };     this.hide=function(){ 
            common.removeClass(module,'active'); 
            if(background){ 
                common.removeClass(background,'active'); 
            } 
        }; 

    function testFunction() { 
        window.addnewPop.show(); 

    </SCRIPT> </head> 
    <body bgcolor="#FFFFFF" > 
    <DIV id=absbox> 
    <DIV class=active id=transparent> </DIV> 
    <DIV class="absbox active" id=addnew> 
    <H3> Confirm </H3> 
    <br> 
    &nbsp;&nbsp;The set value is not proper. Check it. 
    <div  id=cen_div> 
      <br> 
      <BUTTON id=ok_btn>OK </BUTTON> 
      <br> 
    </div> 
    </DIV> </DIV> 
    <div class="maintop"> 
    <ul> 
    <li class="maintop_yellow"> 
    <ul> 
    <li> 
    <div class ="TitleText" id="SA_RC4501_lalHeadMsg">111 <a href="./RC_4_50.phtml"> <?php echo _("C-1145");?> </a>>22 </div> 
    </li> 
    </ul> 
    </li> 
    </ul> 
    </div> 
    <div class="maincenter_text" > 
    <div id="SA_div1"> 
    <table class="table_input"> 
    <tr> 
    <td> 
    <input type="text" id="SA_RC4501_txt1" onkeyup="SA_oncheckBtn()" oncontextmenu="window.event.returnValue=false" maxlength="256"/> 
    </td> 
    </tr> 
    </table> 
    <table class="table_input2"> 
    <tr> 
    <td> 
    <input type="text" id="SA_RC4501_txt2" onkeyup="SA_oncheckBtn()" oncontextmenu="window.event.returnValue=false" maxlength="10"/> 
    </td> 
    </tr> 
    </table> 
    </div> 
    <div class="div_bottom"> 
    <div> 
    <input type="button" id="SA_RC4501_btnOK" onclick="testFunction()" value="ok" class="btn" > 
    </div> 
    </div> 
    </form> 
    </div> 
    <div style="position: relative" class="inputstyle">
    <input type="text" name="TextBox1" style="ime-mode:disabled" id="RC404_rdo2_sel1" class="date1" maxlength="2"
    <img src="" class="btnUp1" onmouseover="this.style.filter='alpha(opacity: 70)'"onmouseout="this.style.filter=''" >
    <img src="" class="btnDown1" onmouseover="this.style.filter='alpha(opacity: 70)'"onmouseout="this.style.filter=''">
    </div>
    </body> 
    </html> 
      

  16.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head >
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><STYLE type=text/css>HTML {
    BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; OVERFLOW: hidden; HEIGHT: 100%; BORDER-RIGHT-WIDTH: 0px
    }
    BODY {
    FONT-SIZE: 16px; MARGIN: 0px; HEIGHT: 100%
    }
    BUTTON {
    FONT-SIZE: 14px;
    WIDTH: 60px;
    BORDER-RIGHT: #99a8bd 2px solid;
    BORDER-TOP: #99a8bd 1px solid;
    BORDER-LEFT: #99a8bd 1px solid;
    BORDER-BOTTOM: #99a8bd 2px solid;
    }h3 {
        color:white;
    }#mainbody {
    OVERFLOW-Y: scroll; OVERFLOW-X: auto; WIDTH: 100%; HEIGHT: 100%
    }
    #main {
    BACKGROUND: #ccc; MARGIN: 4px; HEIGHT: 2000px
    }
    #transparent {
    DISPLAY: none; BACKGROUND: #fff; FILTER: alpha(opacity=40); WIDTH: 100%; POSITION: absolute; HEIGHT: 100%; opacity: 0.4
    }
    .active#transparent {
    DISPLAY: block
    }
    .absbox {
    DISPLAY: none; BACKGROUND: #fff; POSITION: absolute; z-index: 10000;
    }
    .active {
    DISPLAY: block
    }
    #addnew {
    BORDER-RIGHT:  2px solid;
    BORDER-TOP:  1px solid;
    BORDER-LEFT:  1px solid;
    WIDTH: 360px;
    BORDER-BOTTOM:  2px solid;
    background-color:#CCCCCC;
    }#addnew H3 {
    PADDING-RIGHT: 5px; PADDING-LEFT: 15px; FONT-SIZE: 14px; BACKGROUND: red; PADDING-BOTTOM: 5px; MARGIN: 0px; CURSOR: move; PADDING-TOP: 5px
    }
    #addnew H3 SPAN.fr {
    MARGIN-TOP: -3px; FLOAT: right; CURSOR: pointer
    }
    #addnew H3 BUTTON {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: #e9f2fb; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TABLE {
    BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; MARGIN: 10px 15px 15px; WIDTH: 320px; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TH {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 3px; VERTICAL-ALIGN: top; LINE-HEIGHT: 22px; PADDING-TOP: 3px; HEIGHT: auto; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TD {
    BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 3px; VERTICAL-ALIGN: top; LINE-HEIGHT: 22px; PADDING-TOP: 3px; HEIGHT: auto; BORDER-RIGHT-WIDTH: 0px
    }
    #addnew TH {
    FONT-WEIGHT: bold
    }
    #addnew TD {
    WIDTH: 65%
    }
    #addnew INPUT {
    WIDTH: 100%
    }
    #addnew BUTTON {
    LINE-HEIGHT: normal
    }
    #cen_div {
    margin-bottom:10px;
    text-align:center;
    }.btnUp1 {
    position: absolute;
    MARGIN-TOP: 1px;
    width: 18px;
    height: 10px;
    left: 41px;
    top: 1px;
    }
    .btnDown1 {
    position: absolute;
    width: 18px;
    height: 10px;
    left: 41px;
    top: 10px;
    }
    .inputstyle {
    MARGIN-LEFT: 100px;
    }
    </STYLE><SCRIPT language=javascript type=text/javascript>
    var common={    bind:function(o,ev,fn){
            if (document.all){
                o.attachEvent('on'+ev,fn);
            }
            else{
                o.addEventListener(ev,fn,false);
            }
            return o;
        },    addClass:function (el,cls){
            var arrCls=cls.split(/[ ]+/);
            if(el.className){
                for(var i=0;i <arrCls.length;i++){
                    if(el.className.indexOf(arrCls[i])>=0){
                        cls=cls.replace(new RegExp('[ ]*'+arrCls[i]+'[ ]*'),' ');
                    }
                }
                el.className=[el.className].concat(cls).join(' ');
            }
            else{
                el.className=cls;
            }
        },    removeClass:function (el,cls){
            if(el.className){
                if(el.className.indexOf(cls)>=0){
                    el.className=el.className.replace(new RegExp('[ ]*'+cls+'[ ]*','g'),' ');
                }
            }
        }};function init(){
        var drag1=document.getElementById('addnew');
        var drag1bar=drag1.getElementsByTagName('h3')[0];
        new DragObject({module:drag1,handle:drag1bar});    window.addnewPop=new Popup({module:drag1,background:document.getElementById('transparent')});
        //document.getElementById('addnew_btnclz').onclick=addnewPop.hide;
        document.getElementById('ok_btn').onclick=window.addnewPop.hide;
        //document.getElementById('test').onclick=addnewPop.show;
     
        addnewPop.hide();
    }common.bind(window,'load',init);function DragObject(args){
        var module=typeof(args.module)=='string'?document.getElementById(args.module):args.module;
        var handle=typeof(args.handle)=='string'?document.getElementById(args.handle):args.handle;    function startDrag(e){
            var e=e||window.event;
            //var elem=e.target||e.srcElement;        document.onmousemove=onDrag;
            document.onmouseup=stopDrag;
            module.subX=module.offsetLeft-e.clientX;
            module.subY=module.offsetTop-e.clientY;        return false;
        }    function onDrag(e){
            e=e||window.event;        module.style.left=module.subX+e.clientX+'px';
            module.style.top=module.subY+e.clientY+'px';        return false;
        }    function stopDrag(){
            document.onmousemove=null;
            document.onmouseup=null;
        }    handle.onmousedown=startDrag;}function Popup(args){
        var module=typeof(args.module)=='string'?document.getElementById(args.module):args.module;
        var background=args.background?(typeof(args.background)=='string'?document.getElementById(args.background):args.background):null;    this.show=function(){
            common.addClass(module,'active');
            module.style.left = (window.innerWidth / 2 - module.offsetWidth / 2) + "px";
            module.style.top = (window.innerHeight / 2 - module.offsetHeight / 2) + "px";
            if(background){
                common.addClass(background,'active');
    background.style.width = document.body.scrollWidth + 'px';
    background.style.height = document.body.scrollHeight + 'px';
            }
        };    this.hide=function(){
            common.removeClass(module,'active');
            if(background){
                common.removeClass(background,'active');
            }
        };
    }
    function testFunction() {
        window.addnewPop.show();
    }
    </SCRIPT></head>
    <body bgcolor="#FFFFFF" >
    <DIV id=absbox>
    <DIV class=active id=transparent> </DIV>
    <DIV class="absbox active" id=addnew>
    <H3> Confirm </H3>
    <br>
    &nbsp;&nbsp;The set value is not proper. Check it.
    <div  id=cen_div>
      <br>
      <BUTTON id=ok_btn>OK </BUTTON>
      <br>
    </div>
    </DIV> </DIV>
    <div class="maintop">
    <ul>
    <li class="maintop_yellow">
    <ul>
    <li>
    <div class ="TitleText" id="SA_RC4501_lalHeadMsg">111 <a href="./RC_4_50.phtml"> <?php echo _("C-1145");?> </a>>22 </div>
    </li>
    </ul>
    </li>
    </ul>
    </div>
    <div class="maincenter_text" >
    <div id="SA_div1">
    <table class="table_input">
    <tr>
    <td>
    <input type="text" id="SA_RC4501_txt1" onkeyup="SA_oncheckBtn()" oncontextmenu="window.event.returnValue=false" maxlength="256"/>
    </td>
    </tr>
    </table>
    <table class="table_input2">
    <tr>
    <td>
    <input type="text" id="SA_RC4501_txt2" onkeyup="SA_oncheckBtn()" oncontextmenu="window.event.returnValue=false" maxlength="10"/>
    </td>
    </tr>
    </table>
    </div>
    <div class="div_bottom">
    <div>
    <input type="button" id="SA_RC4501_btnOK" onclick="testFunction()" value="ok" class="btn" >
    </div>
    </div>
    </form>
    </div>
    <div style="position: relative" class="inputstyle">
    <input type="text" name="TextBox1" style="ime-mode:disabled" id="RC404_rdo2_sel1" class="date1" maxlength="2"
    <img src="" class="btnUp1" onmouseover="this.style.filter='alpha(opacity: 70)'"onmouseout="this.style.filter=''" >
    <img src="" class="btnDown1" onmouseover="this.style.filter='alpha(opacity: 70)'"onmouseout="this.style.filter=''">
    </div>
    </body>
    </html>