頁面比較醜，只把功能實現了。 ^ ^
模仿easyui <br><br> <br><title>模仿easyui dialog的效果 title> <br><script> <BR>//取得頁面元素<BR>var getElement = function() { <BR>return document.getElementById(arguments[0]) || false; <BR>} <BR>} <BR> function openDialog(dialogId) { <BR>var maskId = "mask"; <BR>//如果有，先刪除原來的<BR>if (getElement(dialogId)) { <BR>document.removeChild(getElement(dialogId) );//刪除操作：彈出的div <br>} <br>if (getElement(maskId)) { <BR>document.removeChild(getElement(maskId));//刪除操作：彈出的不可操作(面)層<BR>} <BR><BR>//背景置灰<BR>var maskDiv = document.createElement("div"); <BR>maskDiv.id = maskId; <BR>maskDiv.style.position = " absolute"; <BR>maskDiv.style.zIndex = "1"; <BR>maskDiv.style.width = document.body.scrollWidth "px"; <BR>maskDiv.style.height = document.body "px"; <BR>maskDiv.style.height = document.body.body. "; <BR>maskDiv.style.top = "0px"; <br>maskDiv.style.left = "0px"; <br>maskDiv.style.background = "gray"; <BR>maskDiv.style.filter = "alpha(opacity=10)"; <BR>maskDiv.style.opacity = "0.30";//透明度<BR>document.body.appendChild(maskDiv);//向body增加背景層<BR><BR>//Dialog <BR>var dialogDiv = document.createElement("div"); <BR>dialogDiv.id = dialogId; <BR>dialogDiv.style.position = "absolute"; <BR>Pdiaf. = "9999"; <BR>dialogDiv.style.width = "400px"; <BR>dialogDiv.style.height = "200px"; <BR>dialogDiv.style.top = (parseInt(document.body.). 200) / 2 "px"; // 畫面居中<BR>dialogDiv.style.left = (parseInt(document.body.scrollWidth) - 400) / 2 "px"; // 螢幕置中<BR>dialogDiv.style. background = "white"; <BR>dialogDiv.style.border = "1px solid gray"; <BR>dialogDiv.style.padding = "5px"; <BR>dialogDiv.innerHTML = "(Dialog Content)"; <>dialogDiv.innerHTML = "(Dialog Content)"; >//Dialog之中的關閉操作：關閉背景層和Dialog層<BR>var closeControlloer = document.createElement("a");//建立一個超連結(做為關閉的觸發) <BR>closeControlloer.href = "#"; <BR>closeControlloer.innerHTML = "關閉"; <BR>closeControlloer.onclick = function() { <BR>document.body.removeChild(getElement(dialogId));//刪除diaglog <BR>document .body.removeChild(getElement(maskId));//刪除背景層<BR>} <BR>dialogDiv.appendChild(closeControlloer);//dialog之中增加"關閉"操作<BR>document.body.appendChild(dialogDiv之中增加"關閉"操作</script>
document.body.appendChild(dialogDiv );//body中增加dialog
}
Open Dialog 
