弹出自定义模式窗口

<html>
<script type="text/javascript">

function judge() {
    if (document.getElementById('pictitle').value == "" ) {
        document.getElementById('div1').innerHTML = "<span style='color:red;'>请输入标题!</span>";
        return false;
    } else {
        document.getElementById('div1').innerHTML = "&nbsp;";
       
    }
    if (document.getElementById('piccontext').value == "") {
        document.getElementById('div2').innerHTML = "<span style='color:red;'>请输入内容!</span>";
        return false;
    } else {
    document.getElementById('div2').innerHTML = "&nbsp;";
   
    }
    if (document.getElementById('picURL').value == "") {
        document.getElementById('div3').innerHTML = "<span style='color:red;'>请输入路径!</span>";
        return false;
    } else {
    document.getElementById('div3').innerHTML = "&nbsp;";

}
return true;
}
function msg(info){
var p=document.createElement("DIV");
if (!info) var info='默认替代文字';
p.id="p";
p.style.position="absolute";
p.style.width=document.body.scrollWidth;
//p.style.height = (document.body.offsetHeight > document.body.scrollHeight) ? '100%' : document.body.scrollHeight;
p.style.height = '100%';
p.style.zIndex='998';
p.style.top='0px';
  p.style.left='0%';
p.style.backgroundColor="gray";      //灰色背景
p.style.opacity='0.5';
p.style.filter="alpha(opacity=70)";  //透明度40
document.body.appendChild(p);
var p1=document.createElement("DIV");
var top=parseInt(parseInt(document.body.scrollHeight)*0.25)+document.body.scrollTop;
p1.style.position="absolute";
p1.style.width="300px";
p1.id="p1";
var left=Math.ceil(((document.body.scrollWidth)-parseInt(p1.style.width.replace('px','')))/2)+document.body.scrollLeft;
p1.style.height="200px";
p1.style.zIndex='999';
p1.style.top=top+'px';
  p1.style.left=left+'px';
p1.style.border="0px solid red";
var html="";
  html+="<center><form action='ShowPicture.aspx' method='post' enctype='multipart/form-data'>"
  html+="<div class='p3' style='height:1px;overflow:hidden;background:red;width:294px;border-left:1px solid red;border-right:1px solid red;'></div>"
  html += "<div class='p1' style='height:20px;overflow:hidden;background:red;width:300px;border-left:1px solid red;border-right:1px solid red;color:#fff;font-size:9pt;font-weight:bold;text-align:left;'>提示<span style='width:250px;'>&nbsp;</span><a href='javascript:this.cancle()' style='color:white;'>×</a></div>"
  html += "<div id='c' style='height:180px;width:300px;background-color:#FEEACB;overflow:hidden;border-left:1px solid red;border-right:1px solid red;padding-top:20px;font-size:9pt;'><span style='font-size:12pt;'><b>" + info + "</b></span><br>标题:<input type='text' id='pictitle' name='pictitle' size='32' /><br><div id='div1'>&nbsp;</div>内容:<input type='text' id='piccontext' size='32' name='piccontext' /><br><div id='div2'>&nbsp;</div>路径:<input type='file' id='picURL' name='picURL' /><br><div id='div3'>&nbsp;</div><input type='submit' value='确认添加' onclick='return judge();' /><br></div>"
 
  html+="<div class='p3' style='height:1px;overflow:hidden;background:red;width:300px;border-left:1px solid red;border-right:1px solid red'></div>"
  html+="</form></center>"
document.body.appendChild(p1);
p1.innerHTML=html;
var arr=document.getElementsByTagName("select");
var i=0;
while(i<arr.length){
  arr[i].style.visibility='hidden';
  i++;
}
this.cancle=function(){
document.body.removeChild(document.getElementById('p'));
document.body.removeChild(document.getElementById('p1'));
var arr=document.getElementsByTagName("select");
  var i=0;
  while(i<arr.length){
  arr[i].style.visibility='visible';
  i++;
  }
}
}

</script>
<body>
<input type="button" onclick="msg();" value="弹出窗口" />
</body>
</html>

posted @ 2010-05-28 11:33  展翅高飞  阅读(207)  评论(0编辑  收藏  举报