`

js html常用功能

    博客分类:
  • Html
阅读更多
网页中嵌入外部页面的四种方法 
一.应用框架技术 
---- 要在宿主页面中嵌入外部页面的方法是,在宿主页面中包含外部页面的位置插入“< IFRAME name="XXX" width=X height=X frameborder=0 src="XXX.htm" >< /IFRAME >”语句即可(注意: < IFRAME >标签中的各种属性含义请查阅相关技术手册)。 

---- 如果想在嵌入的外部页面过长时不出现滚动条,在外部文件< body >标签中加入“scroll=no”或者在宿主页面< IFRAME >标签中加入“scrolling=no”即可。 

---- 但这样做会出现一个问题,就是宿主页面和外部页面背景色不同,这样会给人造成页面不是一个整体的感觉。这时,只要在引入的外部文件中使用和宿主页面相同的背景色就可以解决这一问题。注意,如果您使用的是IE 5.5或以上版本的话,直接在标签< IFRAME >内设置属性allowTransparency="true"(即框架背景透明)即可。 

---- 在应用框架技术时,为什么不使用框架页面(即< FRAMESET >)呢?现在有很多网站是通过使用框架页面来分割版面的,并达到了统一网站整体风格的目的,但笔者的体会是框架页面的操作灵活性较差,不像内建框架(即< IFRAME >)这样可以在宿主页面中的任何位置插入。 

二.使用Scriptlets组件技术 

---- 应用这种技术的方法是在宿主页面中包含外部页面的位置插入“< OBJECT style="border: 0px" type="text/x-scriptlet" data="XXX.htm" width=X Height=X >< /OBJECT >”语句即可(注意: < OBJECT >标签中的各种属性含义请查阅相关技术手册)。 

---- 在IE 5.0及以后版本中,scriptlets和Html组件(HTCs)被重新命名为Windows脚本编程组件(WSC),其特点类似于上文所讲的框架技术。它有自己的不透明方形区域,并覆盖在宿主页面上,因此不能很平滑地用于具有纹理背景的宿主页面中,其工作方式类似于ActiveX控件,具有自己独立的事件、方法和属性。 

三.使用脚本文件技术 

---- 我们知道document.write方法可以在宿主页面中输出内容,这样就可以通过在宿主页面中引入外部脚本文件来达到嵌入外部页面的目的。方法是在宿主页面中包含外部页面的位置插入“< SCRIPT language="javascript" src="import.js" >< /SCRIPT >”,然后对外部页面进行改造,将每一行内容写入document.write中,并另外保存在扩展名为js的新文件中。 

---- 这种方法的特点是外部页面不具有自己的方形区域,和宿主页面浑然一体,但由于外部页面内容全部写在脚本中,无法做到所见即所得,必须等到脚本运行时才能看到实际效果,这样就为修改调试增加了困难。 

四.使用内置行为技术 

---- 在IE 5.0及以后版本,引入了一项被称为“DHTML行为”的新功能,并在其中内置了许多默认行为。当将一种行为应用于宿主页面上的标准HTML元素时,它可以增强该元素的默认功能,并提供该行为中定义的任何新方法、属性或事件。其实大家对行为技术并不陌生,微电脑世界2001年18期的《主页加入收藏设置面面观》一文就提到了利用IE中内置的homepage行为技术进行主页设置的方法。我们同样可以利用IE 5.0内置的download行为,来达到在宿主页面中嵌入外部页面的目的,其代码如下。 

<span id="outHTML"></span> 
<IE:Download ID="ieDownload" STYLE="behavior:url(#default#download)" /> 
<script> 
function onDownloadDone(downDate){ 
outHTML.innerHTML=downDate 
} 
ieDownload.startDownload('../static/article.htm',onDownloadDone) 
</script> 

---- 其原理就是使用download行为提供的startDownload方法下载一个外部文本文件,并将文件中的文本内容作为参数传递给onDownloadDone函数,然后再由该函数对文本内容进行处理,在本例中是作为showImport对象的内容显示出来。如果在函数中对文本内容做相应的处理,并与相关技术结合,如XML,就可以实现更为复杂的功能。

---- 这种方法使得外部页面不再具有自己的方形区域,和宿主页面浑然一体; 提供了更大的灵活性,通过使用对象的innerHtml属性可以真正做到在宿主页面的任何位置插入外部文件内容; 修改简单,只须用可视网页编辑软件(如FrontPage 2000)将外部页面修改即可轻松改变网站整体风格。可以说这是在宿主页面中嵌入外部页面的最好方法 (注: 以上代码在Windows 98 SE/IE 5.0中测试通过)。 





网页设计特效实用代码 
2007-10-18 17:16 

在线制作icon图标 
http://www.chami.com/html-kit/services/favicon/ 
进入主页以后自动播放声音 
<embed src="http://你的网站/music.rm" hidden=true autostart=true loop=true> 

进入主页后自动最大话,省的去在自己单击了 
<script> 
self.moveTo(0,0) 
self.resizeTo(screen.availWidth,screen.availHeight) 
</script> 

显示现在时间的脚本 
<script language=vbscript>document.write now</script> 

显示最后修改时间的脚本 
<script>document.write(document.lastModified)</script> 

设为首页,加为收藏,加入频道,启动outlook发信 
<a style="cursor:hand"  
onclick="this.style.behavior="url(#default#homepage)"; 
this.setHomePage("yourURL">设为首页</a> 

<a style="cursor:hand" 
onclick="window.external.AddFavorite(location.href,document.title);">加入收藏</a> 

<a href=javascript:window.external.addChannel("typhoon.cdf")>加入频道</a> 

<a href="youEmail">与我联系</a> 

Flash中在按钮上如何加“设为首页”“加入收藏”?action怎么写啊? 
on (release) { 
getURL("javascript:void(document.links[0].style.behavior='url(#default#homepage)');void document.links[0].setHomePage('84design.com/" target="_blank">http://www.84design.com/&#39;);", "_self"); 
} 

加入收藏: 
on(release) { 
getURL("javascript:window.external.AddFavorite('84design.com/" target="_blank">http://www.84design.com/&#39;,&#39;E佳工作室&#39;)"); 
} 

状态栏动态显示现在时间 
<script> 
function see(){ 
window.setTimeout("see()",1000); 
today = new Date(); 
self.status = today.toString(); 
} 
</script> 
<body onload=see()> 

关闭窗口的脚本 
<a href=javascript:close()>[关闭窗口]</a> 

窗口定时关闭 
先将如下代码网页文件的<head></head>区: 
 <script language="JavaScript"> 
 function closeit() { setTimeout("self.close()",10000) //毫秒 } 
 </script> 
然后再在<body></body>标内加入如:<body onload="closeit()"> 

网页自动关闭 
 <html> 
 <head> 
 <object id=closes type="application/x-oleobject" 
 classid="clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11"> 
 <param name="Command" value="Close"> 
 </object> 
 </head> 
 <body onload="window.setTimeout('closes.Click()',10000)"> 
 这个窗口会在10秒过后自动关闭,而且不会出现提示. 
 </body> 
 </html> 

按下F12键,直接返回首页 
<script>function look(){ 
if(event.keyCode==123){document.location.href=http://www.wowo-design.com/} 
} 
if(document.onkeydown==null) 
{document.onkeydown=look} 
</script> 

后退,刷新,前进 
<input type=button value=后退 onclick=history.go(-1)> 
<input type=button value=刷新 onclick=history.go(-0)> 
<input type=button value=前进 onclick=history.go(+1)> 

设定时间弹出窗口,4000=4秒,当然你可以自定义 
<script>function l() { 
window.open("yourURL","name","width=500,height=150,border=0") 
} 
setTimeout("l()",4000) 
</script> 

随机替换图片                                                                                                                             <script> 
 document.write('<img src="img/'+parseInt(Math.random()*(5)) 
 +'.gif"height="40" width="50">') 
</script> 

图片文件名为0.gif 1.gif 2.gif 3.gif 4.gif 

防止表格被撑破的代码 
<table width=100 border=1> 
<tr><td style="word-break:break-all">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</td></tr> 

Dreamweaver里画细线标格 
<table style="border-collapse: collapse"> 

有没有可能用层来遮住FLASH? 
1.在flash的parameters里加入 <param name="wmode" value="transparent"> 
2.<body onblur=self.focus()> 

如何让Flash按钮同时打开两个网页 
最简单的办法,最一个按扭,把 
on(press){ 
getURL("http://www.*****.com";,_blank); 
getURL("http://www.*****.com";,_blank); 
} 
加在按扭上 

怎样点不同的链接在同一个Iframe里显示? 
<table width="510" border="0" cellspacing="0" cellpadding="0"> 
<tr> 
<td width="218" align="center" bgcolor="#eeeeee"><a href="http://www.******.com"; target="manager">blueidea</a> 
</td> 
<td width="292" align="center" bgcolor="#eeeeee"><a href="http://www.******.com/bbs"; target="manager">bbs</a></td> 
</tr> 
<tr> 
<td height="200" colspan="2"><iframe border=0 frameborder=0 framespacing=0 height=200 marginheight=0 marginwidth=0 name=manager scrolling="NO" noresize src="http://www.******.com"; width=500 vspale="0"></iframe></td> 
</tr> 
</table> 

节日倒计时 
<Script Language="JavaScript"> 
   var timedate= new Date("October 1,2002"); 
   var times="国庆节"; 
   var now = new Date(); 
   var date = timedate.getTime() - now.getTime(); 
   var time = Math.floor(date / (1000 * 60 * 60 * 24)); 
   if (time >= 0) 
   document.write("现在离"+times+"还有: "+time +"天") 
</Script> 

随机变换背景图象(一个可以刷新心情的特效) 
在<head></head>之间加上如下代码: 
<Script Language="JavaScript"> 
   image = new Array(4); //定义image为图片数量的数组 
   image [0] = 'tu0.gif' //背景图象的路径 
   image [1] = 'tu1.gif' 
   image [2] = 'tu2.gif' 
   image [3] = 'tu3.gif' 
   image [4] = 'tu4.gif' 
   number = Math.floor(Math.random() * image.length); 
   document.write("<BODY BACKGROUND="+image[number]+">"); 
</Script> 

select挡住div的解决方法 
在div里加入下面的代码,根据需要调整就可以了。 
<iframe src="javascript:false" scrolling="no" frameborder="0" style="z-index:-1;position:absolute; top:5px; left:2px;width:168;height:100px;"> 
</iframe> 

服务器上如何定义连接 
MM_www_STRING ="driver={Microsoft access Driver (*.mdb)};dbq=" & server.mappath("../data/www.mdb") 

链接到 
response.redirect"login.asp" 
location.href="xx.asp" 

取得IP 
userip = Request.ServerVariables("HTTP_X_FORWARDED_FOR") 
If userip = "" Then userip = Request.ServerVariables("REMOTE_ADDR") 

sql="update feedbak set hit=hit+1 where id="&request("id") 
conn.execute(sql) 

截取字符是否加... 
function formatStr(str,len) 
if(len(str)>len) 
str = left(str,len) + "..." 
end if 
formatStr = str 
end function 

接收表单 
If Ucase(Request.ServerVariables("REQUEST_METHOD")) = "POST" then 
end if 

图片宽度 
<script language="javascript"> 
<!-- 
var flag=false; 
function DrawImage(ckp){ 
var image=new Image(); 
image.src=ckp.src; 
if(image.width>0 && image.height>0) 
{flag=true; 
if(image.width>120){ 
ckp.width=120; 
}else{ 
ckp.width=image.width; 
} 
ckp.alt=image.width+"×"+image.height; 
} 
} 
//--> 
</script> 
I'll be Back 22:18:06 
<img src="<%=formPath%>/<%=rs("photoname")%>" border="0" > 

跳转 
<meta http-equiv=refresh content='0; url=/distributor/distributor.aspx'> 

溢出栏的设制 
visible:超出的部分照样显示; 
hidden:超出的部分隐藏; 
scrool:不管有否超出,都显示滚动条; 
auto:有超出时才出现滚动条; 

onMouseOver:鼠标移到目标上; 
onMouseUp:按下鼠标再放开左键时; 
onMouseOut:鼠标移开时; 
onMouseDown:按下鼠标时(不需要放开左键); 
onClink:点击时; 
onDblClick:双击时; 
onLoad:载入网页时; 
onUnload:离开页面时; 
onResize:当浏览者改变浏览窗口的大小时; 
onScroll:当浏览者拖动滚动条的时。 

CSS样式 
a:link:表示已经链接; 
a:hover:表示鼠标移上链接时; 
a:active:表示链接激活时; 
a:visited:表示己点击过的链接。 

跳出对话框链接 
javascript:alert('lajflsjpjwg') 

后退:javascript:history.back(1) 

关闭窗口:javascript:window.close(); 

窗口还原 
function restore(){ 
window.moveTo(8,8); 
window.resizeTo(screen.width-24,screen.availHeight-24); 
} 

head区是指首页HTML代码的<head>和</head>之间的内容。 
必须加入的标签 
1.公司版权注释 

<!--- The site is designed by Maketown,Inc 06/2000 ---> 

2.网页显示字符集 

简体中文:<META HTTP-EQUIV="Content-Type" C> 
繁体中文:<META HTTP-EQUIV="Content-Type" C> 
英 语:<META HTTP-EQUIV="Content-Type" C> 

3.网页制作者信息 

<META name="author" c> 

4.网站简介 

<META NAME="DESCRIPTION" C> 

5.搜索关键字 

<META NAME="keywords" C> 

6.网页的css规范 

<LINK href="style/style.css" rel="stylesheet" type="text/css"> 
(参见目录及命名规范) 

7.网页标题 

<title>xxxxxxxxxxxxxxxxxx</title> 

可以选择加入的标签 
1.设定网页的到期时间。一旦网页过期,必须到服务器上重新调阅。 
<META HTTP-EQUIV="expires" C> 

2.禁止浏览器从本地机的缓存中调阅页面内容。 
<META HTTP-EQUIV="Pragma" C> 

3.用来防止别人在框架里调用你的页面。 
<META HTTP-EQUIV="Window-target" C> 

4.自动跳转。 
<META HTTP-EQUIV="Refresh" C> 
5指时间停留5秒。 

5.网页搜索机器人向导.用来告诉搜索机器人哪些页面需要索引,哪些页面不需要索引。 
<META NAME="robots" C> 
CONTENT的参数有all,none,index,noindex,follow,nofollow。默认是all。 

6.收藏夹图标 
<link rel = "Shortcut Icon" href="favicon.ico"> 

所有的javascript的调用尽量采取外部调用. 
<SCRIPT LANGUAGE="javascript" SRC="script/xxxxx.js"></SCRIPT> 

附<body>标签: 

<body>标签不属于head区,这里强调一下,为了保证浏览器的兼容性,必须设置页面背景<body bgcolor="#FFFFFF"> 

flash透明 

在flash的源代码中加上:<param name="wmode" value="transparent"> 表格透明 
style="FILTER: alpha(opacity=72)" 

网址前添加icon的方法 
1、上http://www.******.com上用他的icon editor online制作一个图标。他会将做好的图标通过email即时发送给你。 

2、把这个命名为favicon.ico的图标放置在index.html同一个文件夹中。就可以了。 

作一个图标文件,大小为16*16像素。文件扩展名为ico,然后上传到相应目录中。在HTML源文件“<head></head>”之间添加如下代码: 

<Link Rel="SHORTCUT ICON" href="http://图片的地址(注意与刚才的目录对应)"> 

其中的“SHORTCUT ICON”即为该图标的名称。当然如果用户使用IE5或以上版本浏览时,就更简单了,只需将图片上传到网站根目录下,自动识别 

可以在收藏夹中显示出你的图标 
<link rel="Bookmark" href="favicon.ico"> 

状态栏连接说明 
<A HREF="链接到某处" >某某链接</a> 
链接说明 
<a href=“”Title=链接说明> 

禁止鼠标右键 
在<body>标签中加入 <body > 

禁止复制,鼠标拖动选取 
<body ondragstart=window.event.returnValue=false oncontextmenu=window.event.returnValue=false onselectstart=event.returnValue=false> 

水平线 
<hr width="长度" size="高度" color="颜色代码" noshade> noshade为有无阴影 

表单电子邮件提交 
< form name="content" method="post" action="mailto:电子邮箱" >< /form> 
文本域名为Subject 为邮件的标题 
邮件链接定制 
Mailto:地址 ? Subject=邮件的标题 &bc=抄送 &bcc=密件抄送 

背景音乐 
<bgsound src=地址 loop="-1"> 

消除ie6自动出现的图像工具栏,设置 GALLERYIMG属性为false或no . 
<IMG SRC="mypicture.jpg" HEIGHT="100px" WIDTH="100px" GALLERYIMG="no"> 

防止点击空链接时,页面往往重置到页首端 
代码“javascript:void(null)”代替原来的“#”标记 

如何避免别人把你的网页放在框架中 
<script language=“javascript”><!--if (self!=top){top.location=self.location;} -->< /script> 

页面定时刷新 
<meta http-equiv="Refresh" c > 

页面定时转向新的地址 
<meta http-equiv="refresh" c> 

显示日期 
<script language="javascript"><!-- 
today=new Date(); 
var week; var date; 
if(today.getDay()==0) week="星期日" 
if(today.getDay()==1) week="星期一" 
if(today.getDay()==2) week="星期二" 
if(today.getDay()==3) week="星期三" 
if(today.getDay()==4) week="星期四" 
if(today.getDay()==5) week="星期五" 
if(today.getDay()==6) week="星期六" 
date=(today.getYear())+"年"+(today.getMonth()+1)+"月"+today.getDate()+"日"+" " 
document.write("<span style='font-size: 9pt;'>"+date+week+"</span>"); 
// --> 
</script> 

文字滚动 
插入边框为0的1行1列的表格,在表格中输入文字,选中文字, 
按ctrl+t输入marquee direction="up", 回车即可让文字在表格区域内向上滚动。 
(right、down可用于让文字或图象向右及向下滚动,修改html原代码还可以得到需要的滚动速度。 

表单验正 
<SCRIPT language=javascript> 
function checkform(theform){ 
if(theform.name.value==""){ 
alert("姓名不能为空!"); 
theform.name.focus(); 
return false; 
} 
if(theform.tel.value==""){ 
alert("电话不能为空!"); 
theform.tel.focus(); 
return false; 
} 
} 
</SCRIPT> 

定义鼠标 
body{cursor: url(cur.ani或cur);} 

以图片方式插视频 
<IMG height=240 loop=infinite dynsrc=http://amedia.efu.com.cn/EFUADD0001.rmvb width=320> 

层在flash上面 
< param name="wmode" value="opaque" > 

延迟跳转 
<meta http-equiv=refresh content='3; url=javascript:window.close();'> 

空链接 
javascript:; 

标题表格 
<fieldset> 
<legend>表格的说明</legend> 
</fieldset> 

细线表格 
style="BORDER-COLLAPSE: collapse;" 

滚动条颜色代码 
BODY{ 
SCROLLBAR-FACE-COLOR: #FFFFFF; 
SCROLLBAR-HIGHLIGHT-COLOR: #FFFFFF; 
SCROLLBAR-SHADOW-COLOR: #FFFFFF; 
SCROLLBAR-3DLIGHT-COLOR: #FFCBC8; 
SCROLLBAR-ARROW-COLOR: #FFFFFF; 
SCROLLBAR-TRACK-COLOR: #FFFFFF; 
SCROLLBAR-DARKSHADOW-COLOR: #FFCBC8; 
SCROLLBAR-BASE-COLOR: #FFFFFF 
} 

连续的英文或者一堆感叹号!!!不会自动换行的问题 
只要在CSS中定义了如下句子,可保网页不会再被撑开了 

table{table-layout: fixed;} 
td{word-break: break-all; word-wrap:break-word;} 

注释一下: 

1.第一条table{table-layout: fixed;},此样式可以让表格中有!!!(感叹号)之类的字符时自动换行。 

2.td{word-break: break-all},一般用这句这OK了,但在有些特殊情况下还是会撑开,因此需要再加上后面一句{word-wrap:break-word;}就可以解决。此样式可以让表格中的一些连续的英文单词自动换行。 

控制横向和纵向滚动条的显隐? 
<body style="overflow-y:hidden"> 去掉x轴 
<body style="overflow-x:hidden"> 去掉y轴 
<body scroll="no">不显 

表格变色 
<TD onmouseover="this.style.backgroundColor='#FFFFFF'" 
onmouseout="this.style.backgroundColor=''" 
style="CURSOR: hand"> 

普通iframe页面 
<iframe name="name" src="main.htm" width="450" height="287" scrolling="Auto" frameborder="0"></iframe> 

iframe自适应高度 
<iframe name="pindex" src="index.asp" frameborder=false scrolling="auto" width="100%" height="100%" frameborder=no onload="document.all['pindex'].style.height=pindex.document.body.scrollHeight" ></iframe> 

iframe(嵌入式帧)自适应高度 
填写的嵌入地址一定要和本页面在同一个站点上,否则会提示“拒绝访问!”。对跨域引用有权限问题,请查阅其他资料。 
<iframe name="guestbook" src="gbook/index.asp" scrolling=no width="100%" height="100%" frameborder=no onload="document.all['guestbook'].style.height=guestbook.document.body.scrollHeight"></iframe> 

字号缩放 
越来越多的人长时间的泡网,眼镜的普及率也越来越高,让文字大点,让更多的用户看的更清楚。 
<script type="text/javascript"> 
function doZoom(size) 
{document.getElementById('zoom').style.fontSize=size+'px';} 
</script> 
<span id="zoom">需要指定大小的文字</span> 
<a href="javascript:doZoom(16)">大</a> <a href="javascript:doZoom(14)">中</a> <a href="javascript:doZoom(12)">小</a> 

select挡住div的解决方法 
在div里加入下面的代码,根据需要调整就可以了。 
<iframe src="javascript:false" scrolling="no" frameborder="0" style="z-index:-1;position:absolute; top:5px; left:2px;width:168;height:100px;"> 
</iframe> 

跳转菜单新窗口 
<select name="select" onchange="window.open(this.options[this.selectedIndex].value)"> 
<option value="http://www.microsoft.com/ie"> Internet Explorer</option> 
<option value="http://www.microsoft.com"> Microsoft Home</option> 
<option value="http://msdn.microsoft.com"> Developer Network</option> 
</select> 

flash透明选项 
<param name="wmode" value="transparent"> 

记录并显示网页的最后修改时间 
<script language=JavaScript> 
document.write("最后更新时间: " + document.lastModified + "") 
</script> 

让IFRAME框架内的文档的背景透明 
<iframe src="about:<body style='background:transparent'>" allowtransparency></iframe> 

打开窗口即最大化 
<script language="JavaScript"> 
<!-- Begin 
self.moveTo(0,0) 
self.resizeTo(screen.availWidth,screen.availHeight) 
// End --> 
</script> 

文字或图片弹出指定大小的窗口 
在body中加入 
<script language="JavaScript" type="text/JavaScript"> 
function MM_openBrWindow(theURL,winName,features) {window.open(theURL,winName,features);} 
</script> 
弹出代码 
<a href="#" target="_self" onClick="MM_openBrWindow('windows01.htm','','width=550,height=380')" width="550" height="380" border="0">图片或文字</a> 

flash按钮加链接 
on (press) { 
getURL("http://www.******.com","_blank"); 
} 

细线分隔线 
<hr noshade size=0 color=#C0C0C0> 

消除ie6自动出现的图像工具栏,设置 GALLERYIMG属性为false或no . 
<IMG SRC="mypicture.jpg" HEIGHT="100px" WIDTH="100px" GALLERYIMG="no"> 

禁止页面正文内容被选取 
<body oncontextmenu="return false" ondragstart="return false" onselectstart ="return false" onselect="document.selection.empty()" oncopy="document.selection.empty()" onbeforecopy="return 
false"onmouseup="document.selection.empty()"> 

不能点右键,不用CTRL+A,不能复制作! 
<body oncontextmenu="window.event.returnValue=false" 
onkeypress="window.event.returnValue=false" 
onkeydown="window.event.returnValue=false" 
onkeyup="window.event.returnValue=false" 
ondragstart="window.event.returnValue=false" 
onselectstart="event.returnValue=false"> 
</body> 

随机变换背景图象(一个可以刷新心情的特效) 
<Script Language="JavaScript"> 
   image = new Array(4); //定义image为图片数量的数组 
   image [0] = 'tu0.gif' //背景图象的路径 
   image [1] = 'tu1.gif' 
   image [2] = 'tu2.gif' 
   image [3] = 'tu3.gif' 
   image [4] = 'tu4.gif' 
   number = Math.floor(Math.random() * image.length); 
   document.write("<BODY BACKGROUND="+image[number]+">"); 
</Script> 

flash载入影片 
on (release) 
{ 
loadMovie("1-01.swf", "_root.loaderclip"); 
} 

图片表单按钮 
<form id="form1" name="form1" method="post" action=""> 
<img src="login.gif" width="62" height="22" onclick="document.form1.submit()" /> 
</form> 

左右阴影背景的CSS定义方法 
body { 
text-align:center; 
background-repeat: repeat-y; 
background-position: center; 
background-image: url(../images/bg.jpg); 
} 

如何关闭层 
<div id="Layer1"></div> 
<a href="#" onClick="Layer1.style.display='none'">关闭层</a> 

运行代码框 
<script> 
function Preview() 
{var TestWin=open(''); 
TestWin.document.write(code.value);} 
</script> 
<textarea id=code cols=60 rows=15></textarea> 
<br> 
<button onclick=Preview() >运行</button> 

给表格做链接 
<table width="100%" onclick="window.open('http://www.******.com/&#39;, '_blank')" style="CURSOR:hand"> 
<tr> 
<td height="100" bgcolor="f4f4f4">&nbsp;</td> 
</tr> 
</table> 

CSS文字阴影 
.shadowfont{FILTER: dropshadow(color=#666666, offx=1, offy=1, positive=1); FONT-FAMILY: "宋体"; FONT-SIZE: 9pt;COLOR: #ffffff;} 

表格透明 
style="FILTER: alpha(opacity=72)" 

Alt和Title的区别 
alt 用来给图片来提示的。Title用来给链接文字或普通文字提示的。 

<a href="#" Title="给链接文字提示">文字</a> 
<p Title="给链接文字提示">文字</p> 

<img src="图片链接" alt="给图片提示"> 

在同一页面设置不同文字链接效果的样式 
<style type="text/css"> 
.green {COLOR: #309633} 
.green A:link {COLOR: #309633; TEXT-DECORATION: none} 
.green A:visited {COLOR: #309633; TEXT-DECORATION: none} 
.green A:hover {COLOR: #309633; TEXT-DECORATION: underline} 
.green A:active {COLOR: #309633; TEXT-DECORATION: none} 
</style> 
<a href="#" class="green">文字</a> 

在建立与服务器的连接时出错。在连接到 SQL Server 2005 时,在默认的设置下 SQL Server 不允许进行远程连接可能会导致此失败。 (provider: SQL 网络接口, error: 26 - 定位指定的服务器/实例时出错) 
首 选请确认SQL SERVER EXPRSS已安装到本地计算机上,并且SQL SERVER (SQLEXPRESS)服务已经成功启动。如果问题仍然存在,可以尝试应打开“SQL Server 外围应用配置器”,选择“服务和连接的外围应用配置器”,然后将“远程连接”配置为“同时使用 TCP/IP 和 named pipes” 

由于启动用户实例的进程时出错,导致无法生成 SQL Server 的用户实例。该连接将关闭。 
将连接字符串中的“User Instance=True”修改为“User Instance=False”即可。 

无法将文件 'X:WebsiteApp_DataDatabase.mdf' 作为数据库 ''. 附加。当前命令发生了严重错误。应放弃任何可能产生的结果。 
需要为X分区以及X分区的子文件夹和文件分配Users组的“读取”权限。 

尝试为文件 X:WebsiteApp_DataDatabase.mdf 附加自动命名的数据库,但失败。已存在同名的数据库,或指定的文件无法打开或位于 UNC 共享目录中。 
首 选要确认已经为X分区以及X分区的子文件夹和文件分配了Users组的“读取”权限。如果问题仍然存在,请使用SQL Server Management Studio连接到SQLEXPRESS数据库实例,检查是否有名称是“Database”的数据库存在。如果有,分离同名数据库即可。如果还有问题检查web.config中Data Source=.\SQLEXPRESS,如果同时装了sql2000名称应为MSSQL$SQLEXPRESS。 

无法打开用户默认数据库。登录失败。 
用户 'NT AUTHORITYNETWORK SERVICE' 登录失败。 
数据库文件Database.mdf 的读写权限被设置成只有NETWORK SERVICE才具有。解决方法是先停止掉SQL SERVER (SQLEXPRESS)服务,然后从父项集成权限,再次启动SQL SERVER (SQLEXPRESS)服务即可。 


 以上是一个简化版本关系图. 
User:用户表,存放用户信息 
Role:角色表,存放角色信息 
UserInRole:用户角色映射表,存放用户和角色的对就关系,多对多,一个用户可以对应多个 
角色,而不同的角色有一同的权限。 
Permissions:权限表,不同的角色对应不同的权限。权限信息使用一个字段flag来表示, 
好处是可以使用位运算来计算权限,缺点是用位标识的权限受理论值限制,如int理论上可以 
标识31种不同的权限, 当然可以整加一个字段来弥补,ApplicationID标识不同的模块 
Application:模块信息。 



  [Flags] 
     public enum Flag:long 
     { 
      View=1, 
      Edit=2, 
      Delete=4 
     } 
特性[Flag]告诉编译器,当编译器看到Flag枚举时,它会充许你用|(or)操作符组合枚举值, 
就像二的整数幂一样, 
例如 Flag  Administer=Flag.View|Flag.Edit|Flag.Delete;表示三种权限的组合。 


基础知识: 

位运算 

枚举Flag 

当编译器看到Flag枚举时,它会充许你用|(or)操作符组合枚举值, 
就像二的整数幂一样, 
例如 Flag Administer=Flag.View|Flag.Edit|Flag.Delete; 

常用操作,检查是否存在 
Flag administer=Flag.View|Flag.Edit|Flag.Delete; 
  public bool Check(Flag administer,Flag mask) 
        { 
            bool bReturn = false; 
            if ((administer & mask) == mask) 
                bReturn = true; 

            return bReturn; 
        } 
调用  Check(administer,Flag.Edit)将返回true. 

public Flag SetBit(Flag administer,Flag mask) 
        { 
          return  administer |= mask; 
           
        } 

administer |= mask;操作相当于 administer = administer |mask; 

 从枚举中减去一种状态 
  administer &=mask; 

  如 : 
Flag administer=Flag.View|Flag.Edit|Flag.Delete; 
如需要禁止删除权限. 
administer &=Flag.Delete; 

 另外,标记为flag的枚举类型,可以不设置值 
   public enum Flag:long 
     { 
      View, 
      Edit, 
      Delete 
     } 
   如需要设置,按以下规律, View=1,Edit=2,Delete=4,Reply=8按2次方累加,为什么会这样?因为他使用二进制操作, 
   当你使用 View=1,Edit=2,Delete=3,Reply=4这样的值, Flag.Delete 包含的值是Flag.Delete还是View=1|Edit=2就无从检测了. 

每个用户,可以属于不同的角色不同的角色分配不同的权限,计算所有解权的所有可能的权限组合,只要有充许的权限,那么该用户既获取该权限。 

在CS系统中,Permissions表合用了二个字段来标识权限. 
AllowMask,DenyMask 规责是Deny优先,也就是说当权限标记为Deny那么不论是否Allow一律禁止该用户进行此项操作。 

另外,像论坛类的权限设计,仅仅一个ApplicationID字段是不够用的,因为每个版块都需要设置不同的权限,来控制权限的粒度,可在增加一张Permission表,ApplicationID修改为版块ID 
这样,就可以针对不同的版块设置不同的权限 

好了,接下的问题是怎么和.net自带的权限系统挂钩了。。 



在asp.net系统中 ,HttpContext.Current.User实现了一个接口IPrincipal,IPrincipal包含了另一个接口Identity 

  我们在设计User类的时候继承此接口 
  public class User:IPrincipal 
  { 
    string username; 
    public string Username 
    { 
     get{return username;} 
     set{username=value;} 
    } 
  } 

  实现IPrincipal接口方法 
   public IIdentity Identity 
        { 
            get { 
                if (!string.IsNullOrEmpty(username)) 
                    _Identity = new GenericIdentity(username,"Forums"); 
                return (IIdentity)_Identity; 
            } 
        } 

public bool IsInRole(string role) 
{ 
..... 
} 

怎样和asp.net挂钩呢,这里可以在登陆时做检查 

if(HttpContext.Current!=null){ 
                User u= Users.GetUser(name); 
                HttpContext.Current.User =u; 

在使用时  
User u = HttpContext.Current.User as User; 
当然检查用户角色可以直接用 





if(HttpContext.Current.User.Identity.IsAuthenticated&&HttpContext.Current.User.IsInRole(角色名)) 


另外可以直接把到当用户权限策略挂接到当前线程 ,使用以下方法 
    AppDomain.CurrentDomain.SetPrincipalPolicy(User); 

好了,接下来,怎么check权限? 








我倾向于使用Attribute 


[AttributeUsage(AttributeTargets.Class | AttributeTargets.Method | AttributeTargets.Property | AttributeTargets.Delegate, Inherited = true, AllowMultiple = true)] 
    public class CheckPermissionAttribute : Attribute 
    { 

        int appID; 
        public int ApplicationID 
        { 
            get { return appID; } 
            set { appID = value; } 
        } 
        Permission _allMask; 
        public Permission AllMask 
        { 
            get { return _allMask; } 
            set { _allMask = value; } 
        } 

        public CheckPermissionAttribute(ApplicationID app, Permission allMask) 
        { 
            appID = app; 
            _allMask = allMask; 
        } 
        public CheckPermissionAttribute(Permission allMask) 
        { 
            _allMask = allMask; 
        } 

    } 
AttributeUsage 第一个参数表示该属性可以应用于类,方法,属性,代理上 
Inherited 检查继承的权限。 
AllowMultiple 充许多次应用。 

按下来,设计一个基类,继承自Page: 

public   class PageBase : Page 
{ 
Flag _allMask; 

/// <summary> 
    /// 检查类型权限 
    /// </summary> 
    public void CheckClass() 
    { 
        Type type = this.GetType(); 
        CheckPermissionAttribute att = (CheckPermissionAttribute)CheckPermissionAttribute.GetCustomAttribute(type, typeof(CheckPermissionAttribute)); 
        if (att != null) 
        { 
            Check(att.AllMask); 
        } 
    } 

  /// <summary> 
    /// 检查函数调用权限 
    /// </summary> 
    /// <param name="methodName">方法名</param> 
    public void CheckMethod(string methodName) 
    { 
        Type type = this.GetType(); 
        string name = "*"; 
        if (!string.IsNullOrEmpty(methodName)) 
            name = methodName; 
        MemberInfo[] mis = type.FindMembers(MemberTypes.Method ,BindingFlags.Instance | BindingFlags.NonPublic | BindingFlags.Public | BindingFlags.IgnoreCase,Type.FilterNameIgnoreCase,name); 
        foreach (MethodInfo m in mis) 
       { 
           CheckPermissionAttribute att = (CheckPermissionAttribute)CheckPermissionAttribute.GetCustomAttribute(m, typeof(CheckPermissionAttribute)); 
           if (att != null) 
           {  

               Check(att.AllMask); 
                           
           } 
            
       } 
       return; 
  
    
    } 
    public void Check(Flag permissions) 
    { 
        if (!CheckPermission(permissions)) 
        { 
            string url = string.Format("MsgPage.aspx?msg={0}", HttpUtility.UrlEncode("您没有权限访问该资源")); 
            Response.Redirect(url); 
        } 
    } 
    public void Check(ApplicationID appID, Flag permissions) 
    { 
        PermissionManager  pm= Spaces.PermissionManager.Instance(appType); 
        if (!CheckPermission(pm,permissions)) 
        { 
            string url = string.Format("MsgPage.aspx?msg={0}", HttpUtility.UrlEncode("您没有权限访问该资源")); 
            Response.Redirect(url); 
        } 

    } 

protected override void OnInit(EventArgs e) 
    { 
        CheckClass(); 
        base.OnInit(e); 
    } 
} 




如何使用: 

[CheckPermission(2, Flag.View)] 
public partial class MyPage : PageBase 
{ 

} 

若没有查看权限,会自运导向错误页面。 

在类上应用挺方便。 

方法上应用我于一个方法比较麻烦,我还没有找到在页面class里怎么获取当前调用的类名. 

可以调用 CheckMethod(方法名称);如 
[CheckPermission(2, Flag.Delete)] 
public partial class MyPage : PageBase 
{ 
  public void test() 
  { 
   CheckMethod("test"); 
   ....... 
  } 
} 

 

分享到:
评论

相关推荐

    HTML和JavaScript的常用功能

    HTML和JavaScript的常用功能

    js表单验证实例,HTML文件,javascript常用表单验证

    js表单验证实例,HTML文件,javascript常用表单验证: 账号、密码、身份证等

    JS技术,验证,HTML部分常用功能

    JS技术,验证,HTML部分常用功能,JS正则表达式,部分网上有的,部分自己工作遇上整理的

    javascript常用代码大全.html

    5.2 html编辑控件类 5.3 颜色选取框控件 5.4 下拉菜单 5.5 两层或多层次的下拉菜单 5.6 仿IE菜单的按钮。(效果如rongshuxa.com的导航栏目) 5.7 状态栏,title栏的动态效果(例子很多,可以研究一下) 5.8 ...

    javascript,css3,html5讲义

    《疯狂HTML 5/CSS3/JavaScript讲义》是一本全面介绍HTML 5、CSS3和JavaScript前端开发技术的图书,系统地介绍了HTML 5常用的元素和属性、HTML 5的表单元素和属性、HTML5的绘图支持、HTML 5的多媒体支持、CSS3的功能...

    用 js + html 实现一个网页版日历

    使用js + html 实现的简单的网页版日历,顶部默认会显示当前日期和时间,时间会精确到秒...当日会用黄色背景标识,用大家常用的js函数实现主要功能,核心代码量不足100行,代码运行正常,无明显bug,实现起来非常简单。

    疯狂HTML 5/CSS 3/JavaScript讲义(随书源码)

    《疯狂html 5/css 3/javascript讲义》是一本全面介绍html 5、css 3和javascript前端开发技术的图书,系统地介绍了html 5常用的元素和属性、html 5的表单元素和属性、html 5的绘图支持、html 5的多媒体支持、css 3的...

    HTML脚本大全常用Javascript特效代

    HTML脚本大全常用Javascript特效代。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。

    html+css+js实现简约大气自适应导航网站+随机壁纸+天气插件源码.zip

    无环境要求,单纯使用html、css、js,任何服务器或虚拟机都可以使用,甚至可以直接使用第三方的前端托管就可以。 简约大气自适应导航网站+随机壁纸+天气插件 非常好看、简约大气的导航网站,可以自由切换不同...

    HTML网页助手,包括JS万年历、闹钟、备忘录 常用查询.rar

    HTML网页助手,包括JS万年历、网页闹钟、备忘录、天气预报、常用查询,纯静态html页面,集成了一些比较实用的功能。把此页面设置成活动桌面,希望能对你的工作带来方便。解压缩即可使用。

    javascript代码常用大全

    5.2 html编辑控件类 5.3 颜色选取框控件 5.4 下拉菜单 5.5 两层或多层次的下拉菜单 5.6 仿IE菜单的按钮。(效果如rongshuxa.com的导航栏目) 5.7 状态栏,title栏的动态效果(例子很多,可以研究一下) ...

    【JavaScript源代码】JavaScript实现表单验证功能.docx

     本文实例为大家分享了JavaScript实现表单验证功能的具体代码,供大家参考,具体内容如下 以下是JavaScript的表单验证功能,可根据JS代码编写出你想要的HTML和CSS的代码。  关于正则表达式的使用,以及常用的正则...

    Javascript效果总结(包含绝大多数Javascript效果和常用的Javascript功能)

    此文档收集了HTML各种效果. 大多数源码都是经过测试过的,有需要者请放心使用.

    art-template 常用功能

    使用引用的template.js方式的demo。包含art-template 常用功能,普通展示,if判断,each循环,嵌套循环,管道数据转换方法,原样展示html片段设置。

    HTML5+CSS3+JavaScript

    本书是一本介绍HTML 5、CSS 3和JavaScript开发的实用图书。全书可分 为4个部分。 第一部分:全面地介绍了HTML 5的全部标签,并且详细地介绍了各标签 所支持的属性,并为各HTML标签、属性都提供了配套的示例页面,...

    JS常用函数方法收集1

    currentMonthDays.js 获取当...timeFormat.js 时间个性化输出功能 isDigit.js 判断是否为数字类型 setCookie.js 设置cookie值 getCookie.js 获取cookie值 addFavorite.js 加入收藏夹 setHomepage.js 设为首页 ......

    家居网-网页课程设计(JS + CSS + HTMl )+ 设计报告

    (2)使用表单和控件的常用DOM属性、方法、事件进行表单前端验证1次和其他功能1次。 (3)使用BOM调用浏览器功能1次,例如页面滚动、秒杀倒计时、打印、通知、本地存储等。 (4)使用ECharts库(https://echarts.apache.org...

    Omega.js:Omega.js是一个小型香草javascript库,用于前端开发人员在一次性脚本中使用的最常用功能

    Omega.js是一个小型香草javascript库,用于前端开发人员在一次性脚本中使用的最常用功能。 多年来,开发人员一直依靠繁重的库来完成这些简单且重复的任务。 这样做时,已加载库的大部分仍未使用。 这会造成不必要的...

    javascript 常用代码大全

    5.2 html编辑控件类 5.3 颜色选取框控件 5.4 下拉菜单 5.5 两层或多层次的下拉菜单 5.6 仿ie菜单的按钮。(效果如rongshuxa.com的导航栏目) 5.7 状态栏,title栏的动态效果(例子很多,可以研究一下) ...

    家居网 网页期末大作业(JS + CSS + html)+设计报告

    (2)使用表单和控件的常用DOM属性、方法、事件进行表单前端验证1次和其他功能1次。 (3)使用BOM调用浏览器功能2次,例如页面滚动、秒杀倒计时、打印、通知、本地存储等。 (4)使用jQuery或jQuery插件1次,提供用户体验...

Global site tag (gtag.js) - Google Analytics