当前位置:首页>网络学院>网页制作>Web标准>文章内容

WEB标准中如何在新窗口打开页面

[ 来源:http://www.it55.com | 作者: | 时间:2007-11-30 | 收藏 | 推荐 ] 【

由于在XHTML1.0过渡型标准之前,target="_blank"属性一直是点击链接后弹出新窗口的方法,但是XHTML1.0严格型标准以及XHTML1.1之后就不再支持target属性,

  也就是说不能再用target="_blank"来弹出一个新的窗口!本实例探讨的是在XHTML1.1标准下弹出新窗口的方法,并结合Cookies实现客户端自定义弹出新窗口的方法。


以下是引用片段:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>自定义打开链接的方式</title>
<style type="text/css">
<!--
#main {
    width: 600px;
    margin-right: auto;
    margin-left: auto;
    border: 1px solid #006699;
    height: 600px;
}
#title {
    background-color: #006699;
    padding: 10px;
    width: 100%;
    font-family: Verdana, Arial;
    font-size: 16px;
    color: #FFFFFF;
    font-weight: bold;
}
#property {
    margin: 10px;
    border: 1px solid #99CC00;
    height: 24px;
    background-color: #F8FEE9;
    font-size: 12px;
    line-height: 24px;
}
#link {
    margin: 10px;
    border: 1px solid #0099CC;
    background-color: #EFEEFF;
    font-size: 12px;
    height: 366px;
    padding: 20px;
}
#copyright {
    font-size: 12px;
    padding: 20px;
    color: #003333;
    line-height: 16px;
}
img{
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
}
.center {
    text-align: center;
}
-->
</style>
<script type="text/javascript">
<!--
function onlinks(){


if(getCookie("links")=="_blank"){
document.getElementById("c1").checked=true;
document.getElementById("c2").checked=true;
newlinks();//dolinks();
}
else{
document.getElementById("c1").checked=false;
document.getElementById("c2").checked=false;
newlinks();//dolinks();
}
}


function dolinks(){
document.getElementById("c2").checked?setCookie('links','_blank',1):deleteCookie('links');
}


function newlinks() { 
 document.getElementById("c1").checked?fc1():fc2()
 function fc1(){
 linktarget="_blank";document.getElementById("cookies_p").style.display="block"}
 function fc2(){
 linktarget="";document.getElementById("cookies_p").style.display="none"}


 var anchors = document.getElementsByTagName("a"); 
 for (var i=0; i<anchors.length; i++) { 
   var anchor = anchors[i]; 
   if (anchor.getAttribute("href")) 
     anchor.target = linktarget; 
 } 


function getCookie(name) {
    var start = document.cookie.indexOf( name + "=" );
    var len = start + name.length + 1;
    if ( ( !start ) && ( name != document.cookie.substring( 0, name.length ) ) ) {
        return null;
    }
    if ( start == -1 ) return null;
    var end = document.cookie.indexOf( ";", len );
    if ( end == -1 ) end = document.cookie.length;
    return unescape( document.cookie.substring( len, end ) );
}    


function setCookie( name, value, expires, path, domain, secure ) {
    var today = new Date();
    today.setTime( today.getTime() );
    if ( expires ) {
        expires = expires * 1000 * 60 * 60 * 24;
    }
    var expires_date = new Date( today.getTime() + (expires) );

(编辑:IT资讯之家 www.it55.com

返回顶部
共2页: 上一页 1 [2] 下一页  
上一篇:CSS中的定位position详解   下一篇:没有了

网友评论

[以下评论为网友观点,不代表本站。请自觉遵守互联网相关政策法规,所有连带责任均有评论者自负。]
[不超过250字]