WEB标准学习:自定义打开链接的方式

2007-11-30 10:35:42  作者

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

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

以下是引用片段
%26lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"%26gt;
%26lt;html xmlns="http://www.w3.org/1999/xhtml"%26gt;
%26lt;head%26gt;
%26lt;meta http-equiv="Content-Type" content="text/html; charset=gb2312" /%26gt;
%26lt;title%26gt;自定义打开链接的方式%26lt;/title%26gt;
%26lt;style type="text/css"%26gt;
%26lt;!--
#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;
}
--%26gt;
%26lt;/style%26gt;
%26lt;script type="text/javascript"%26gt;
%26lt;!--
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%26lt;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 ) %26amp;%26amp; ( 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) );
document.cookie = name+"="+escape( value ) +
( ( expires ) ? ";expires="+expires_date.toGMTString() : "" ) + //expires.toGMTString()
( ( path ) ? ";path=" + path : "" ) +
( ( domain ) ? ";domain=" + domain : "" ) +
( ( secure ) ? ";secure" : "" );
}

function deleteCookie( name, path, domain ) {
if ( getCookie( name ) ) document.cookie = name + "=" +
( ( path ) ? ";path=" + path : "") +
( ( domain ) ? ";domain=" + domain : "" ) +
";expires=Thu, 01-Jan-1970 00:00:01 GMT";
}
--%26gt;
%26lt;/script%26gt;
%26lt;script src="http://www.aaa.com/... /javascript"%26gt;
%26lt;/script%26gt;
%26lt;script type="text/javascript"%26gt;
_uacct = "UA-97125-1";
urchinTracker();
%26lt;/script%26gt;
%26lt;/head%26gt;
%26lt;body onload="onlinks();"%26gt;
%26lt;div id="main"%26gt;
%26lt;div id="title"%26gt;自定义打开链接的方式%26lt;/div%26gt;
%26lt;div id="property"%26gt;
%26lt;label%26gt;
%26lt;input type="checkbox" id="c1" value="checkbox" onclick="newlinks();" /%26gt;
打开链接为新窗口%26lt;/label%26gt;
%26lt;span id="cookies_p" style="display:none"%26gt;
%26lt;label%26gt;
%26lt;input type="checkbox" id="c2" value="checkbox" onclick="dolinks();" /%26gt;
记住我的选择%26lt;/label%26gt;%26lt;/span%26gt;
%26lt;/div%26gt;
%26lt;div id="link"%26gt;
%26lt;p%26gt;%26lt;a href="www.knowsky.comhttp://www.knowsky.com"%26gt;www.knowsky.com%26lt;/a%26gt;%26lt;/p%26gt;
%26lt;p%26gt;%26lt;a href="code.knowsky.comhttp://code.knowsky.com"%26gt;code.knowsky.com%26lt;/a%26gt;%26lt;/p%26gt;
%26lt;p%26gt;%26lt;a href="font.knowsky.comhttp://font.knowsky.com"%26gt;font.knowsky.com%26lt;/a%26gt;%26lt;/p%26gt;
%26lt;p%26gt;%26lt;a href="soft.knowsky.comhttp://soft.knowsky.com"%26gt;soft.knowsky.com%26lt;/a%26gt;%26lt;/p%26gt;
%26lt;/div%26gt;
%26lt;div id="copyright"%26gt;
内容%26lt;/div%26gt;
%26lt;p class="center"%26gt;
%26lt;a href="http://validator.w3.org/check?uri=referer"%26gt;%26lt;imgsrc="http://www.w3.org/Icons/valid-xhtml11%26amp;quo ... 31"width="88"/%26gt;%26lt;/a%26gt;%26lt;/p%26gt;%26lt;/div%26gt;
%26lt;/body%26gt;
%26lt;/html%26gt;

相关文章