效果：點擊會更大更好風格的時候彈出頁面，並且後面的頁面上的按鈕不能夠使用。
代碼實現：js。
知識點：1）js調用dom方法在頁面上新建圖層；
var mesW=document.createElement("div");
mesW.id="mesWindow";
mesW.className="mesWindow";
mesW.innerHTML="<div class='mesWindowTop'><table width='100%' height='100%'><tr><td>"+wTitle+"</td><td style='width:1px;'><input type='button' title='關閉窗口' class='close' value='關閉' /></td></tr></table></div><div class='mesWindowContent' id='mesWindowContent'>"+content+"</div><div class='mesWindowBottom'></div>";
主要方法：var newtag=document.creatElement(“new tag”);
Newtag.innerHTML=”new window code”；
2）js方法禁止鏈接的使用。
Document.getElementsTagName(“Tagname”);例如：
document.getElementsByTagName("p");獲取當前頁面內的所有的p標籤對象數組，調用 for(var i=0;i<y.length;i++){
y[i].disabled = "disabled";實現對鏈接的禁用。Disabled爲點擊的屬性。
具體實現方法：
Js:
<script>
var isIe=(document.all)?true:false;
//彈出方法
function showMessageBox(wTitle,content,wWidth,wHeight)
{
var bWidth=parseInt(document.documentElement.scrollWidth);
var bHeight=parseInt(document.documentElement.scrollHeight);
var back=document.createElement("div");
back.id="back";
var styleStr="top:0px;left:0px;position:absolute;width:"+bWidth+"px;height:"+bHeight+"px;";
styleStr+=(isIe)?"filter:alpha(opacity=100);":"opacity:0.40;";
back.style.cssText=styleStr;
document.body.appendChild(back);
var mesW=document.createElement("div");
mesW.id="mesWindow";
mesW.className="mesWindow";
mesW.innerHTML="<div class='mesWindowTop'><table width='100%' height='100%'><tr><td>"+wTitle+"</td><td style='width:1px;'><input type='button' title='關閉窗口' class='close' value='關閉' /></td></tr></table></div><div class='mesWindowContent' id='mesWindowContent'>"+content+"</div><div class='mesWindowBottom'></div>"; styleStr="width:"+wWidth+"px;height:"+wHeight+"px;position:absolute;top:50%;left:50%;margin-left:-"+wWidth/2+"px;margin-top:-"+wHeight/2+"px;";
mesW.style.cssText=styleStr;
document.body.appendChild(mesW);
}
//關閉窗口
function closeWindow()
{
if(document.getElementById('back')!=null)
{
document.getElementById('back').parentNode.removeChild(document.getElementById('back'));
}
if(document.getElementById('mesWindow')!=null)
{
document.getElementById('mesWindow').parentNode.removeChild(document.getElementById('mesWindow'));
}
var x=document.getElementsByTagName("input");
for(var i=0;i<x.length;i++){
x[i].disabled = "";
}
var y=document.getElementsByTagName("a");
for(var i=0;i<y.length;i++){
y[i].disabled = "";
}
}
//測試彈出
function testMessageBox(ev)
{
var c= document.getElementsByTagName("p");
var value;//p標籤的值；
var x=document.getElementsByTagName("input");
for(var i=0;i<x.length;i++){
x[i].disabled = "disabled";
}
var y=document.getElementsByTagName("a");
for(var i=0;i<y.length;i++){
y[i].disabled = "disabled";
value=y[i].firstChild.nodeValue;
}
messContent="<div style='padding:20px 0 20px 0;text-align:center'><form action='correctculture.action' name='culture' id='culture' method='post'><table><tr><td><textarea name='m_culture'>"+value+"</textarea><input type='hidden' name='boss' value='lisi'/></td></tr><tr><td><input type='submit' value='提交'/></td></tr></table></form></div>";
showMessageBox(‘窗口標題!',messContent,400,200);
}
CSS:
<style>
!-- 彈出窗口css -->
.mesWindow{
border:#666 1px solid;
background:#999999;
}
.mesWindowTop{
height:30px;
border-bottom:#eee 1px solid;
margin-left:4px;
padding:3px;
font-weight:bold;
text-align:left;
font-size:12px;
}
.mesWindowContent{
margin:4px;
font-size:12px;
}
.mesWindow .close{
height:15px;
width:40px;
border:none;
cursor:pointer;
text-decoration:underline;
background:#fff；
}
</style>
這個能夠實現點擊鏈接實現修改的，如果想要其他的功能的話，可以修改紅色字體的具體能實現。