1、去掉窗口滚动条
scroll="no"style="overflow-y:hidden"
2、背景图不再平铺
<style>body{background-image:url(logo.gif);background-repeat:no-repeat;background-position:center}
</style>
3、背景图不再滚动
IE浏览器支持一个Body属性bgproperties,它可以让背景不滚动:
<BodyBackground="图片文件"bgproperties="fixed">
4、设置flash背景为透明
wmode=transparent
5、让IFRAME框架内的文档的背景透明
<iframesrc="你要加入的页面"allowtransparency="true"></iframe>
下面这一句加在你要嵌入的页面中:
<bodystyle=background:transparent>
6、表格也可透明
table{background-color:#996600;filter:Alpha(Opacity=40,Style=0)}
注意:这样加入会影响表格内的图片文字等内容,大家可以这样解决,如下:
<tablewidth="75%"border="1"height="316">
<tr>
<td><spanstyle="position:relative;left:0px;top:0px">throughatop-down,
proactiveapproachwecanremaincustomerfocusedandgoal-directed,innovate
an</span></td>
<tdbgcolor="#993300">
<divalign="center"><spanstyle="position:relative;left:0px;top:0px"><imgsrc="box.gif"width="100"
height="100"></span></div>
</td>
<td><spanstyle="position:relative;left:0px;top:0px">throughatop-down,
proactiveapproachwecanremaincustomerfocusedandgoal-directed,innovate
an</span></td>
</tr>
</table>
随心所欲更改你的鼠标!!!
现在网页的设计都讲究整体统一风格,无论是网页的文字、图像,还是浏览器的滚动条都要求颜色和风格一致。但是很多朋友却对网页上的鼠标不能改变样子而感到苦恼,下面我就介绍两种改变网页上鼠标的方法:
一、用CSS(CascadingStyleSheets,层叠样式表)的方法
首先要制作或者寻找一套适合网页风格的鼠标,我使用的鼠标是weste.ani和weste2.ani,在,将两个文件存放到的网站的文件夹ani,然后在你的网页文件的</head></head>之间加上代码:
<styletype="text/css">
<!--
body{CURSOR:url(ani/weste.ani)}
A{CURSOR:url(ani/weste2.ani)
-->
</style>
再次浏览网页的时候你会发现,网页的鼠标显示已经改变了。当鼠标悬停在链接上的时候,显示的weste2.ani样子,其他时候显示weste.ani。
原理:其实这种方法利用了CSS2的一个cursor的属性cursor:url(url),鼠标文件可以使用jpg、gif、ani和cur多种文件格式。需要注意的这种方式只能在IE5.5以上浏览器中正常显示。
二、利用第三方控件的方法
这种方法非常简单,只需要讲以下代码加到网页文件的<head></head>之间:
<scriptlanguage=javascript>varLoaded=false;varFlag=false;</script>
<scriptsrc=http://files.cometsystems.com/java& ... 000.js'
language=javascript></script>
<scriptlanguage=javascript>if(Loaded&&Flag)TheCometCursor(cd_electric,0,626);</script>
修改后,浏览此网页的时候浏览器会弹出一个“安全设置警告”,点击“是”,系统自动安装控件,鼠标就可以按照你的需要显示了。
那么,如何才能选择你所需要的鼠标样式呢?先登陆网站http://www.cometzone.com,这个网站有14个大类4000多种鼠标,内容十分广泛,鼠标文件制作也很精美,你可以根据需要从类别中选择需要的鼠标,点击相应的鼠标图片就可以预览到不同的效果。
选中鼠标后,点击网页左边导航的“GETCURSORCODE”链接,转到下一页,再点击“SelectCode”按钮,按钮下这个多行文本框里面的内容就是我上面提供的代码,只是代码中TheCometCursor(cd_electric,0,626)部分不同,显示的鼠标状态也不同。
代码:
<html>
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=gb2312">
<title>无标题文档</title>
<scriptlanguage=javascript>varLoaded=false;varFlag=false;</script>
<scriptsrc=http://files.cometsystems.com/java& ... 000.js'
language=javascript></script>
<scriptlanguage=javascript>if(Loaded&&Flag)TheCometCursor(bbird,0,626);</script>
</head>
<body>
</body>
</html>
Javascript写注册表
写注册表:
<SCRIPT>
varWshShell=WScript.CreateObject("WScript.Shell");
WshShell.RegWrite("HKCU\\Software\\ACME\\FortuneTeller\\",1,"REG_BINARY");
WshShell.RegWrite("HKCU\\Software\\ACME\\FortuneTeller\\MindReader","Goocher!","REG_SZ");
varbKey=WshShell.RegRead("HKCU\\Software\\ACME\\FortuneTeller\\");
WScript.Echo(WshShell.RegRead("HKCU\\Software\\ACME\\FortuneTeller\\MindReader"));
WshShell.RegDelete("HKCU\\Software\\ACME\\FortuneTeller\\MindReader");
WshShell.RegDelete("HKCU\\Software\\ACME\\FortuneTeller\\");
WshShell.RegDelete("HKCU\\Software\\ACME\\");
</SCRIPT>
跳转下拉框
<selectonchange="if(value!=)window.location.href=value">
<option>请选择</option>
<optionvalue="www.topkm.com">.NET中华网</option>
<optionvalue="www.topkm.com">Google</option>
</select>
用好看的图片代替一般按钮!
方法一、
<buttonstyle="background:url(yoururl/10.jpg);">
dsfhgsdhf</button>
方法二、
<inputtype="image"name="Submit2"src="botton-image/botton_5.gif"width="60"height="30">
动态改变单元格背景色和内容!
<style>
.td1{background:#CCCCCC;color:red}
.td2{background:#FFFFFF;color:blue}
</style>
<script>
functionchg(){
vart=document.getElementById("tbl");
t.rows[0].cells[0].innerText="改变后的字";
t.rows[0].cells[0].bgColor="red";
}
</script>
<tableborder="1"id=tbl>
<tr>
<tdid="td1"class="td"onmouseover="className=td2"onmouseout="className=td1"onclick=chg()>ffasdfa</td>
<tdclass="td1"onmouseover="className=td2;this.innerText=鼠标悬浮"onmouseout="className=td1;this.innerText=鼠标未悬浮">鼠标未悬浮</td>
</tr>
</table>
<inputtype=buttonvalue="改变字"onclick=chg()>
改变RadioButton背景颜色
代码如下:
<bodybgcolor="#0099FF">
<tableborder=0cellpadding=10width="100%">
<form>
<tr><tdbgcolor=#00ccff>
<inputtype=radioname=rvalue=1>【孟宪会之精彩世界】[没有设定背景颜色]<br>
<inputtype=radioname=rstyle=background-color:#0099ff>【孟宪会之精彩世界】[设定和表格背景相同的颜色]<br>
<inputtype=radioname=rstyle=background-color:#00cdff>【孟宪会之精彩世界】[设定和表格背景相近的颜色]<br>
</td></tr>
</form>
</table>
使下拉框没有凹凸感
<bodyleftmargin="50"topmargin="50">
<palign="center"><b>正在完善中…………</B><br>
<br>欢迎提出宝贵<ahref="mailto:amxh@21cn.com">建议</a></p>
<style>
.optionForSel{font-size:9pt}
</style>
<tablecellpadding="0"cellspacing="0"border="0"width="300">
<tr>
<tdid="selectLength"width="100%"style="height:20px;padding:0px;border:2pxinset#404040;border-right:0px;border-bottom:1pxsolid#D4D0C8;font-size:9pt;">
<divid="selectedValue"style="padding:2px;border:0px;width:100%;height:20px;font-size:9pt;vertical-align:bottom"></div>
</td>
<tdwidth="20"style="height:20px;padding:0px;border-top:2pxinset#404040;border-left:0px;border-right:1pxsolid#D4D0C8;border-bottom:1pxsolid#D4D0C8;font-size:9pt">
<imgsrc="button2.gif"width="20"height="21"border="0"id="mm"onclick="mm_Click()"align="absmiddle">
</td>
</tr>
</table>
<divid="dropdownOption"style="position:absolute;visibility:hidden;width:100%;border:1pxsolid#080808;z-index:1000">
<tablewidth="100%"cellpadding="0"cellspacing="1"class="optionForSel"bgcolor="White">
<tronmouseover="this.style.backgroundColor=#0099ff"onmouseout="this.style.backgroundColor=">
<tdonclick="document.all.selectedValue.innerText=this.innerText">
<imgsrc="
</td>
</tr>
<tr>
<tdonmouseover="this.style.backgroundColor=#0099ff"onmouseout="this.style.backgroundColor="onclick="document.all.selectedValue.innerText=this.innerText">
<imgsrc=
</td>
</tr>
<tr>
<tdonmouseover="this.style.backgroundColor=#0099ff"onmouseout="this.style.backgroundColor="onclick="document.all.selectedValue.innerText=this.innerText">
<imgsrc=
</td>
</tr>
</table>
</div>
<script>
functionmm_Click()
{
if(document.all.dropdownOption.style.visibility==visible)
document.all.dropdownOption.style.visibility=hidden
else
document.all.dropdownOption.style.visibility=visible
}
functioninit(){
document.all.dropdownOption.style.width=document.all.selectLength.clientWidth+22;
document.all.selectedValue.contentEditable=true;
varstrTop=0;
varstrLeft=0;
vare1=document.all.selectLength;
while(e1.tagName!="BODY")
{
strTop+=e1.offsetTop
strLeft+=e1.offsetLeft
e1=e1.offsetParent
}
document.all.dropdownOption.style.top=String(strTop+24)+"px";
document.all.dropdownOption.style.left=String(strLeft)+"px";
}
functionclickE()
{
if(window.event.srcElement.id!=mm)
document.all.dropdownOption.style.visibility=hidden;
}
document.onclick=clickE
window.onload=init
</script>
<br>
<br>
<inputonclick="alert(document.all.selectedValue.innerText)"type="button"value="得到选中的值">
实用推荐各省城市集合
<formaction=" target=_blank>http://www.chinaleader.com/cgi-bin/register.cgi";method=postn ... ctype="multipart/form-data">
<scriptlanguage="javascript">
<!--
varwhere=newArray(35);
functioncomefrom(loca,locacity){this.loca=loca;this.locacity=locacity;}
where[0]=newcomefrom("请选择省份名","请选择城市名");
where[1]=newcomefrom("北京","|东城|西城|崇文|宣武|朝阳|丰台|石景山|海淀|门头沟|房山|通州|顺义|昌平|大兴|平谷|怀柔|密云|延庆");
where[2]=newcomefrom("上海","|黄浦|卢湾|徐汇|长宁|静安|普陀|闸北|虹口|杨浦|闵行|宝山|嘉定|浦东|金山|松江|青浦|南汇|奉贤|崇明");
where[3]=newcomefrom("天津","|和平|东丽|河东|西青|河西|津南|南开|北辰|河北|武清|红挢|塘沽|汉沽|大港|宁河|静海|宝坻|蓟县");
where[4]=newcomefrom("重庆","|万州|涪陵|渝中|大渡口|江北|沙坪坝|九龙坡|南岸|北碚|万盛|双挢|渝北|巴南|黔江|长寿|綦江|潼南|铜梁|大足|荣昌|壁山|梁平|城口|丰都|垫江|武隆|忠县|开县|云阳|奉节|巫山|巫溪|石柱|秀山|酉阳|彭水|江津|合川|永川|南川");
where[5]=newcomefrom("河北","|石家庄|邯郸|邢台|保定|张家口|承德|廊坊|唐山|秦皇岛|沧州|衡水");
where[6]=newcomefrom("山西","|太原|大同|阳泉|长治|晋城|朔州|吕梁|忻州|晋中|临汾|运城");
where[7]=newcomefrom("内蒙古","|呼和浩特|包头|乌海|赤峰|呼伦贝尔盟|阿拉善盟|哲里木盟|兴安盟|乌兰察布盟|锡林郭勒盟|巴彦淖尔盟|伊克昭盟");
where[8]=newcomefrom("辽宁","|沈阳|大连|鞍山|抚顺|本溪|丹东|锦州|营口|阜新|辽阳|盘锦|铁岭|朝阳|葫芦岛");
where[9]=newcomefrom("吉林","|长春|吉林|四平|辽源|通化|白山|松原|白城|延边");
where[10]=newcomefrom("黑龙江","|哈尔滨|齐齐哈尔|牡丹江|佳木斯|大庆|绥化|鹤岗|鸡西|黑河|双鸭山|伊春|七台河|大兴安岭");
where[11]=newcomefrom("江苏","|南京|镇江|苏州|南通|扬州|盐城|徐州|连云港|常州|无锡|宿迁|泰州|淮安");
where[12]=newcomefrom("浙江","|杭州|宁波|温州|嘉兴|湖州|绍兴|金华|衢州|舟山|台州|丽水");
where[13]=newcomefrom("安徽","|合肥|芜湖|蚌埠|马鞍山|淮北|铜陵|安庆|黄山|滁州|宿州|池州|淮南|巢湖|阜阳|六安|宣城|亳州");
where[14]=newcomefrom("福建","|福州|厦门|莆田|三明|泉州|漳州|南平|龙岩|宁德");
where[15]=newcomefrom("江西","|南昌市|景德镇|九江|鹰潭|萍乡|新馀|赣州|吉安|宜春|抚州|上饶");
where[16]=newcomefrom("山东","|济南|青岛|淄博|枣庄|东营|烟台|潍坊|济宁|泰安|威海|日照|莱芜|临沂|德州|聊城|滨州|菏泽");
where[17]=newcomefrom("河南","|郑州|开封|洛阳|平顶山|安阳|鹤壁|新乡|焦作|濮阳|许昌|漯河|三门峡|南阳|商丘|信阳|周口|驻马店|济源");
where[18]=newcomefrom("湖北","|武汉|宜昌|荆州|襄樊|黄石|荆门|黄冈|十堰|恩施|潜江|天门|仙桃|随州|咸宁|孝感|鄂州");
where[19]=newcomefrom("湖南","|长沙|常德|株洲|湘潭|衡阳|岳阳|邵阳|益阳|娄底|怀化|郴州|永州|湘西|张家界");
where[20]=newcomefrom("广东","|广州|深圳|珠海|汕头|东莞|中山|佛山|韶关|江门|湛江|茂名|肇庆|惠州|梅州|汕尾|河源|阳江|清远|潮州|揭阳|云浮");
where[21]=newcomefrom("广西","|南宁|柳州|桂林|梧州|北海|防城港|钦州|贵港|玉林|南宁地区|柳州地区|贺州|百色|河池");
where[22]=newcomefrom("海南","|海口|三亚");
where[23]=newcomefrom("四川","|成都|绵阳|德阳|自贡|攀枝花|广元|内江|乐山|南充|宜宾|广安|达川|雅安|眉山|甘孜|凉山|泸州");
where[24]=newcomefrom("贵州","|贵阳|六盘水|遵义|安顺|铜仁|黔西南|毕节|黔东南|黔南");
where[25]=newcomefrom("云南","|昆明|大理|曲靖|玉溪|昭通|楚雄|红河|文山|思茅|西双版纳|保山|德宏|丽江|怒江|迪庆|临沧");
where[26]=newcomefrom("西藏","|拉萨|日喀则|山南|林芝|昌都|网络|那曲");
where[27]=newcomefrom("陕西","|西安|宝鸡|咸阳|铜川|渭南|延安|榆林|汉中|安康|商洛");
where[28]=newcomefrom("甘肃","|兰州|嘉峪关|金昌|白银|天水|酒泉|张掖|武威|定西|陇南|平凉|庆阳|临夏|甘南");
where[29]=newcomefrom("宁夏","|银川|石嘴山|吴忠|固原");
where[30]=newcomefrom("青海","|西宁|海东|海南|海北|黄南|玉树|果洛|海西");
where[31]=newcomefrom("新疆","|乌鲁木齐|石河子|克拉玛依|伊犁|巴音郭勒|昌吉|克孜勒苏柯尔克孜|博尔塔拉|吐鲁番|哈密|喀什|和田|阿克苏");
where[32]=newcomefrom("香港","");
where[33]=newcomefrom("澳门","");
where[34]=newcomefrom("台湾","|台北|高雄|台中|台南|屏东|南投|云林|新竹|彰化|苗栗|嘉义|花莲|桃园|宜兰|基隆|台东|金门|马祖|澎湖");
where[35]=newcomefrom("其它","|北美洲|南美洲|亚洲|非洲|欧洲|大洋洲");
functionselect(){
with(document.creator.province){varloca2=options[selectedIndex].value;}
for(i=0;i<where.length;i++){
if(where[i].loca==loca2){
loca3=(where[i].locacity).split("|");
for(j=0;j<loca3.length;j++){with(document.creator.city){length=loca3.length;options[j].text=loca3[j];options[j].value=loca3[j];varloca4=options[selectedIndex].value;}}
break;
}}
document.creator.newlocation.value=loca2+loca4;
}
functioninit(){
with(document.creator.province){
length=where.length;
for(k=0;k<where.length;k++){options[k].text=where[k].loca;options[k].value=where[k].loca;}
options[selectedIndex].text=where[0].loca;options[selectedIndex].value=where[0].loca;
}
with(document.creator.city){
loca3=(where[0].locacity).split("|");
length=loca3.length;
for(l=0;l<length;l++){options[l].text=loca3[l];options[l].value=loca3[l];}
options[selectedIndex].text=loca3[0];options[selectedIndex].value=loca3[0];
}}
-->
</script>
<bodyonload="init()">
<fontcolor=#000000><b>来自:</b><br>请输入您所在国家的具体地方。此项可选<br><br>
省份<selectname="province"onChange="select()"></select>城市<selectname="city"onChange="select()"></select><br>
我在<inputtype=textname="newlocation"maxlength=12size=12style="font-weight:bold">不能超过12个字符(6个汉字)
</form>
日期选择(纯JS)
<scriptlanguage=javascript>
varDS_x,DS_y;
functiondateSelector()//构造dateSelector对象,用来实现一个日历形式的日期输入框。
{
varmyDate=newDate();
this.year=myDate.getFullYear();//定义year属性,年份,默认值为当前系统年份。
this.month=myDate.getMonth()+1;//定义month属性,月份,默认值为当前系统月份。
this.date=myDate.getDate();//定义date属性,日,默认值为当前系统的日。
this.inputName=;//定义inputName属性,即输入框的name,默认值为空。注意:在同一页中出现多个日期输入框,不能有重复的name!
this.display=display;//定义display方法,用来显示日期输入框。
}
functiondisplay()//定义dateSelector的display方法,它将实现一个日历形式的日期选择框。
{
varweek=newArray(日,一,二,三,四,五,六);
document.write("<styletype=text/css>");
document.write(".ds_fonttd,span{font:normal12px宋体;color:#000000;}");
document.write(".ds_border{border:1pxsolid#000000;cursor:hand;background-color:#DDDDDD}");
document.write(".ds_border2{border:1pxsolid#000000;cursor:hand;background-color:#DDDDDD}");
document.write("</style>");
document.write("<inputstyle=text-align:center;id=DS_"+this.inputName+"name="+this.inputName+"value="+this.year+"-"+this.month+"-"+this.date+"title=双击可进行编缉ondblclick=this.readOnly=false;this.focus()onblur=this.readOnly=truereadonly>");
document.write("<buttonstyle=width:60px;height:18px;font-size:12px;margin:1px;border:1pxsolid#A4B3C8;background-color:#DFE7EF;type=buttononclick=this.nextSibling.style.display=blockonfocus=this.blur()>选择日期</button>");
document.write("<divstyle=position:absolute;display:none;text-align:center;width:0px;height:0px;overflow:visibleonselectstart=returnfalse;>");
document.write("<divstyle=position:absolute;left:-60px;top:20px;width:142px;height:165px;background-color:#F6F6F6;border:1pxsolid#245B7D;class=ds_font>");
document.write("<tablecellpadding=0cellspacing=1width=140height=20bgcolor=#CEDAE7onmousedown=DS_x=event.x-parentNode.style.pixelLeft;DS_y=event.y-parentNode.style.pixelTop;setCapture();onmouseup=releaseCapture();onmousemove=dsMove(this.parentNode)style=cursor:move;>");
document.write("<tralign=center>");
document.write("<tdwidth=12%onmouseover=this.className=ds_borderonmouseout=this.className=onclick=subYear(this)title=减小年份><<</td>");
document.write("<tdwidth=12%onmouseover=this.className=ds_borderonmouseout=this.className=onclick=subMonth(this)title=减小月份><</td>");
document.write("<tdwidth=52%><b>"+this.year+"</b><b>年</b><b>"+this.month+"</b><b>月</b></td>");
document.write("<tdwidth=12%onmouseover=this.className=ds_borderonmouseout=this.className=onclick=addMonth(this)title=增加月份>></td>");
document.write("<tdwidth=12%onmouseover=this.className=ds_borderonmouseout=this.className=onclick=addYear(this)title=增加年份>>></td>");
document.write("</tr>");
document.write("</table>");
document.write("<tablecellpadding=0cellspacing=0width=140height=20onmousedown=DS_x=event.x-parentNode.style.pixelLeft;DS_y=event.y-parentNode.style.pixelTop;setCapture();onmouseup=releaseCapture();onmousemove=dsMove(this.parentNode)style=cursor:move;>");
document.write("<tralign=center>");
for(i=0;i<7;i++)
document.write("<td>"+week[i]+"</td>");
document.write("</tr>");
document.write("</table>");
document.write("<tablecellpadding=0cellspacing=2width=140bgcolor=#EEEEEE>");
for(i=0;i<6;i++)
{
document.write("<tralign=center>");
for(j=0;j<7;j++)
document.write("<tdwidth=10%height=16onmouseover=if(this.innerText!=&&this.className!=ds_border2)this.className=ds_borderonmouseout=if(this.className!=ds_border2)this.className=onclick=getValue(this,document.all(DS_"+this.inputName+"))></td>");
document.write("</tr>");
}
document.write("</table>");
document.write("<spanstyle=cursor:handonclick=this.parentNode.parentNode.style.display=none>【关闭】</span>");
document.write("</div>");
document.write("</div>");
dateShow(document.all("DS_"+this.inputName).nextSibling.nextSibling.childNodes[0].childNodes[2],this.year,this.month)
}
functionsubYear(obj)//减小年份
{
varmyObj=obj.parentNode.parentNode.parentNode.cells[2].childNodes;
myObj[0].innerHTML=eval(myObj[0].innerHTML)-1;
dateShow(obj.parentNode.parentNode.parentNode.nextSibling.nextSibling,eval(myObj[0].innerHTML),eval(myObj[2].innerHTML))
}
functionaddYear(obj)//增加年份
{
varmyObj=obj.parentNode.parentNode.parentNode.cells[2].childNodes;
myObj[0].innerHTML=eval(myObj[0].innerHTML)+1;
dateShow(obj.parentNode.parentNode.parentNode.nextSibling.nextSibling,eval(myObj[0].innerHTML),eval(myObj[2].innerHTML))
}
functionsubMonth(obj)//减小月份
{
varmyObj=obj.parentNode.parentNode.parentNode.cells[2].childNodes;
varmonth=eval(myObj[2].innerHTML)-1;
if(month==0)
{
month=12;
subYear(obj);
}
myObj[2].innerHTML=month;
dateShow(obj.parentNode.parentNode.parentNode.nextSibling.nextSibling,eval(myObj[0].innerHTML),eval(myObj[2].innerHTML))
}
functionaddMonth(obj)//增加月份
{
varmyObj=obj.parentNode.parentNode.parentNode.cells[2].childNodes;
varmonth=eval(myObj[2].innerHTML)+1;
if(month==13)
{
month=1;
addYear(obj);
}
myObj[2].innerHTML=month;
dateShow(obj.parentNode.parentNode.parentNode.nextSibling.nextSibling,eval(myObj[0].innerHTML),eval(myObj[2].innerHTML))
}
functiondateShow(obj,year,month)//显示各月份的日
{
varmyDate=newDate(year,month-1,1);
vartoday=newDate();
varday=myDate.getDay();
varselectDate=obj.parentNode.parentNode.previousSibling.previousSibling.value.split(-);
varlength;
switch(month)
{
case1:
case3:
case5:
case7:
case8:
case10:
case12:
length=31;
break;
case4:
case6:
case9:
case11:
length=30;
break;
case2:
if((year%4==0)&&(year%100!=0)||(year%400==0))
length=29;
else
length=28;
}
for(i=0;i<obj.cells.length;i++)
{
obj.cells[i].innerHTML=;
obj.cells[i].style.color=;
obj.cells[i].className=;
}
for(i=0;i<length;i++)
{
obj.cells[i+day].innerHTML=(i+1);
if(year==today.getFullYear()&&(month-1)==today.getMonth()&&(i+1)==today.getDate())
obj.cells[i+day].style.color=red;
if(year==eval(selectDate[0])&&month==eval(selectDate[1])&&(i+1)==eval(selectDate[2]))
obj.cells[i+day].className=ds_border2;
}
}
functiongetValue(obj,inputObj)//把选择的日期传给输入框
{
varmyObj=inputObj.nextSibling.nextSibling.childNodes[0].childNodes[0].cells[2].childNodes;
if(obj.innerHTML)
inputObj.value=myObj[0].innerHTML+"-"+myObj[2].innerHTML+"-"+obj.innerHTML;
inputObj.nextSibling.nextSibling.style.display=none;
for(i=0;i<obj.parentNode.parentNode.parentNode.cells.length;i++)
obj.parentNode.parentNode.parentNode.cells[i].className=;
obj.className=ds_border2
}
functiondsMove(obj)//实现层的拖移
{
if(event.button==1)
{
varX=obj.clientLeft;
varY=obj.clientTop;
obj.style.pixelLeft=X+(event.x-DS_x);
obj.style.pixelTop=Y+(event.y-DS_y);
}
}
</script>
从
<scriptlanguage=javascript>
varmyDate=newdateSelector();
myDate.year--;
myDate.inputName=start_date;//注意这里设置输入框的name,同一页中日期输入框,不能出现重复的name。
myDate.display();
</script>
到
<scriptlanguage=javascript>
myDate.year++;
myDate.inputName=end_date;//注意这里设置输入框的name,同一页中的日期输入框,不能出现重复的name。
myDate.display();
</script>
1怎么样可以把图片自动变小到适应发表区的大小啊?
答:
<imgsrc=upfile\2003312322b16g34g11.jpgonload=javascript:this.width=500,this.height=375>
2或是怎么样可以只显示一部分的图片,就是只显示左面的,右面的显示不显示没有问题的。
答:将图片放在iframe中
两select框互相导入同容:
<scriptlanguage="JavaScript">
functioncopyToList(from,to)//from表示:包含可选择项目的select对象名字to表示:列出可选择项目的select对象名字//你可以根据你的具体情况修改
{
fromList=eval(document.forms[0].+from);
toList=eval(document.forms[0].+to);
if(toList.options.length>0&&toList.options[0].value==temp)
{
toList.options.length=0;
}
varsel=false;
for(i=0;i<fromList.options.length;i++)
{
varcurrent=fromList.options[i];
if(current.selected)
{
sel=true;
if(current.value==temp)
{
alert(你不能选择这个项目!);
return;
}
txt=current.text;
val=current.value;
toList.options[toList.length]=newOption(txt,val);
fromList.options[i]=null;
i--;
}
}
if(!sel)alert(你还没有选择任何项目);
}
functionallSelect()//这是当用户按下提交按钮时,对列出选择的select对象执行全选工作,让递交至的后台程序能取得相关数据
{
List=document.forms[0].chosen;
if(List.length&&List.options[0].value==temp)return;
for(i=0;i<List.length;i++)
{
List.options[i].selected=true;
}
}
</script>
<tableborder="0"><formonSubmit="allSelect()">
<tr>
<td>
<selectname="possible"size="4"
MULTIPLEwidth=200style="width:200px">
<optionvalue="1">中国广州
<optionvalue="2">中国上海
<optionvalue="3">中国北京
<optionvalue="4">中国武汉
</select>
</td>
<td><ahref="javascript:copyToList(possible,chosen)">添加至右方--><br>
<br>
</a><ahref="javascript:copyToList(chosen,possible)"><--添加至左方</a></td>
<td>
<selectname="chosen"size="4"
MULTIPLEwidth=200style="width:200px;">
<optionvalue="temp">从左边选择你的地区
</select>
</td>
</tr></form>
</table>
Javascript中的trim函数!
//***************************************************
<scriptlanguage="javascript">
//去除空格
String.prototype.trim=function()
{
returnthis.replace(/(^[\s]*)|([\s]*$)/g,"");
}
//去处左空格
String.prototype.lTrim=function()
{
returnthis.replace(/(^[\s]*)/g,"");
}
//去处右空格
String.prototype.rTrim=function()
{
returnthis.replace(/([\s]*$)/g,"");
}
vars="dfdf";
alert(s.length);
varss=s.trim();
varrs=s.rTrim();
varls=s.lTrim();
alert(ss.length);
alert(rs.length);
alert(ls.length);
</script>
另一种方法:
<script>
functionString.prototype.Trim(){returnthis.replace(/(^\s*)|(\s*$)/g,"");}
s="xxxxxx";
alert(s.Trim());
</script>
动态改变某table行的颜色
<html>
<head>
<title>List</title>
<scriptlanguage="JavaScript">
</script>
</head>
<body>
<formname="form1"Method="POST"action="">
<divalign="center"></td></tr>
<tablewidth="100%"border="1"cellpadding="0"cellspacing="1"bordercolor="#FFFFFF"bgcolor="#000000">
<tr>
<tdheight="27"bgcolor="#6699CC">
<divalign="center"></div></td>
</tr>
</table>
<tablewidth="100%"border="0"cellspacing="1"borderColorLight="#0000cc"borderColorDark="#ffffff"bgcolor="#000000"class="main">
<trbgcolor="#E8E8E8">
<tdheight="26"colspan="3">
<divalign="center"></div></td>
<trbgcolor="#DFDFFF">
<tdwidth="11%"height="22">
<palign="center">select
</td>
<tdwidth="11%"><palign="center">
<labelstyle=cursor:handonClick="OrderBy(GroupID);">
GroupID</label></p></td>
<tdwidth="18%"><palign="center">
<labelstyle=cursor:handonClick="OrderBy(GroupName);">
GroupName</label>
</p></td>
<trname="tr01"id="tr01"bgcolor="#efefef">
<tdheight="22">
<divalign="center">
<inputtype="checkbox"name="0"id="0"value="001"onClick="javascript:if(this.checked){this.parentNode.parentNode.parentNode.bgColor=#ffffff};else{this.parentNode.parentNode.parentNode.bgColor=#efefef}">
</div>
<td>
<divalign="center">001</div>
<td>
<divalign="center">Common</div></td>
</tr>
<trname="tr11"bgcolor="#efefef">
<tdheight="22">
<divalign="center">
<inputtype="checkbox"name="1"value="002"onClick="javascript:if(this.checked){this.parentNode.parentNode.parentNode.bgColor=#ffffff};else{this.parentNode.parentNode.parentNode.bgColor=#efefef}">
</div>
<td><divalign="center">002</div>
<td><divalign="center">344</div></td>
</tr>
<trname="tr21"bgcolor="#efefef">
<tdheight="22">
<divalign="center">
<inputtype="checkbox"name="12"value="003"onClick="javascript:if(this.checked){this.parentNode.parentNode.parentNode.bgColor=#ffffff};else{this.parentNode.parentNode.parentNode.bgColor=#efefef}">
</div>
<td><divalign="center">003</div>
<td><divalign="center">34</div></td>
</tr>
<trname="tr31"bgcolor="#efefef">
<tdheight="22">
<divalign="center">
<inputtype="checkbox"name="13"value="004"onClick="javascript:if(this.checked){this.parentNode.parentNode.parentNode.bgColor=#ffffff};else{this.parentNode.parentNode.parentNode.bgColor=#efefef}">
</div>
<td><divalign="center">004</div>
<td><divalign="center">group2</div></td>
</tr>
<trname="tr41"bgcolor="#efefef">
<tdheight="22">
<divalign="center">
<inputtype="checkbox"name="14"value="005"onClick="javascript:if(this.checked){this.parentNode.parentNode.parentNode.bgColor=#ffffff};else{this.parentNode.parentNode.parentNode.bgColor=#efefef}">
</div>
<td><divalign="center">006</div>
<td><divalign="center">group1</div></td>
</tr>
<trname="tr51"bgcolor="#efefef">
<tdheight="22">
<divalign="center">
<inputtype="checkbox"name="15"value="006"onClick="javascript:if(this.checked){this.parentNode.parentNode.parentNode.bgColor=#ffffff};else{this.parentNode.parentNode.parentNode.bgColor=#efefef}">
</div>
<td>
<divalign="center">007</div>
<td>
<divalign="center">group11</div></td>
</tr>
<trname="tr61"bgcolor="#efefef">
<tdheight="22">
<divalign="center">
<inputtype="checkbox"name="16"value="007"onClick="javascript:if(this.checked){this.parentNode.parentNode.parentNode.bgColor=#ffffff};else{this.parentNode.parentNode.parentNode.bgColor=#efefef}">
</div>
<td><divalign="center">008</div>
<td><divalign="center">group123</div></td>
</tr>
</table>
</div>
</table>
<divalign="center">
<p>
<inputtype="submit"name="Submit"value="Submit">
<br>
<br>
</p>
</div>
</form>
</body>
</html>
一、验证类
1、数字验证内
1.1整数
1.2大于0的整数(用于传来的ID的验证)
1.3负整数的验证
1.4整数不能大于iMax
1.5整数不能小于iMin
2、时间类
2.1短时间,形如(13:04:06)
2.2短日期,形如(2003-12-05)
2.3长时间,形如(2003-12-0513:04:06)
2.4只有年和月。形如(2003-05,或者2003-5)
2.5只有小时和分钟,形如(12:03)
3、表单类
3.1所有的表单的值都不能为空
3.2多行文本框的值不能为空。
3.3多行文本框的值不能超过sMaxStrleng
3.4多行文本框的值不能少于sMixStrleng
3.5判断单选框是否选择。
3.6判断复选框是否选择.
3.7复选框的全选,多选,全不选,反选
3.8文件上传过程中判断文件类型
4、字符类
4.1判断字符全部由a-Z或者是A-Z的字字母组成
4.2判断字符由字母和数字组成。
4.3判断字符由字母和数字,下划线,点号组成.且开头的只能是下划线和字母
4.4字符串替换函数.Replace();
5、浏览器类
5.1判断浏览器的类型
5.2判断ie的版本
5.3判断客户端的分辨率
6、结合类
6.1email的判断。
6.2手机号码的验证
6.3身份证的验证
二、功能类
1、时间与相关控件类
1.1日历
1.2时间控件
1.3万年历
1.4显示动态显示时钟效果(文本,如OA中时间)
1.5显示动态显示时钟效果(图像,像手表)
2、表单类
2.1自动生成表单
2.2动态添加,修改,删除下拉框中的元素
2.3可以输入内容的下拉框
2.4多行文本框中只能输入iMax文字。如果多输入了,自动减少到iMax个文字(多用于短信发送)
3、打印类
3.1打印控件
4、事件类
4.1屏蔽右键
4.2屏蔽所有功能键
4.3-->和<--F5F11,F9,F1
4.4屏蔽组合键ctrl+N
5、网页设计类
5.1连续滚动的文字,图片(注意是连续的,两段文字和图片中没有空白出现)
5.2html编辑控件类
5.3颜色选取框控件
5.4下拉菜单
5.5两层或多层次的下拉菜单
5.6仿IE菜单的按钮。(效果如rongshuxa.com的导航栏目)
5.7状态栏,title栏的动态效果(例子很多,可以研究一下)
5.8双击后,网页自动滚屏
6、树型结构。
6.1asp+SQL版
6.2asp+xml+sql版
6.3java+sql或者java+sql+xml
7、无边框效果的制作
8、连动下拉框技术
9、文本排序
10,画图类,含饼、柱、矢量贝滋曲线
11,操纵客户端注册表类
12,DIV层相关(拖拽、显示、隐藏、移动、增加)
13,TABLAE相关(客户端动态增加行列,模拟进度条,滚动列表等)
14,各种<objectclassid=>相关类,如播放器,flash与脚本互动等
16,刷新/模拟无刷新异步调用类(XMLHttp或iframe,frame)
<scriptlanguage="JavaScript">
<!--
functioncheck(text){
varcheckstr,iMax=5,iMin=3
checkstr="isInt:"+(parseInt(text)==text)+"\n"
checkstr+="isID:"+((parseInt(text)==text)&&(text>=0))+"\n"
checkstr+="小于"+iMax+":"+((parseInt(text)==text)&&(text<iMax))+"\n"
checkstr+="大于"+iMin+":"+((parseInt(text)==text)&&(text>iMin))+"\n"
alert(checkstr)
}
//-->
</script>
<formmethod=postaction="">
<inputtype="text"id="text1"onchange="check(this.value)">
</form>
4、事件类
4.1屏蔽右键
在body标签里加上oncontextmenu=self.event.returnValue=false
4.2屏蔽所有功能键
4.3-->和<--F5F11,F9,F1
4.4屏蔽组合键ctrl+N
<scriptlanguage=javascript>
functionKeyDown(){
if((window.event.altKey)&&
((window.event.keyCode==37)||//屏蔽Alt+方向键←
(window.event.keyCode==39))){//屏蔽Alt+方向键→
alert("不准你使用ALT+方向键前进或后退网页!");
event.returnValue=false;
}
if((event.keyCode==8)||//屏蔽退格删除键
(event.keyCode==116)){//屏蔽F5刷新键
event.keyCode=0;
event.returnValue=false;
}
if((event.ctrlKey)&&(event.keyCode==78)){//屏蔽Ctrl+n
event.returnValue=false;
}
if((event.shiftKey)&&(event.keyCode==121)){//屏蔽shift+F10
event.returnValue=false;
}
if(event.keyCode==122){//屏蔽F11
event.returnValue=false;
}
}
只要知道keyCode即可屏蔽所有功能键
一、验证类
1、数字验证内
1.1整数
/^(-|\+)?\d+$/.test(str)
1.2大于0的整数(用于传来的ID的验证)
/^\d+$/.test(str)
1.3负整数的验证
/^-\d+$/.test(str)
2、时间类
2.1短时间,形如(13:04:06)
functionisTime(str)
{
vara=str.match(/^(\d{1,2})(:)?(\d{1,2})\2(\d{1,2})$/);
if(a==null){alert(输入的参数不是时间格式);returnfalse;}
if(a[1]>24||a[3]>60||a[4]>60)
{
alert("时间格式不对");
returnfalse
}
returntrue;
}
2.2短日期,形如(2003-12-05)
functionstrDateTime(str)
{
varr=str.match(/^(\d{1,4})(-|\/)(\d{1,2})\2(\d{1,2})$/);
if(r==null)returnfalse;
vard=newDate(r[1],r[3]-1,r[4]);
return(d.getFullYear()==r[1]&&(d.getMonth()+1)==r[3]&&d.getDate()==r[4]);
}
2.3长时间,形如(2003-12-0513:04:06)
functionstrDateTime(str)
{
varreg=/^(\d{1,4})(-|\/)(\d{1,2})\2(\d{1,2})(\d{1,2}):(\d{1,2}):(\d{1,2})$/;
varr=str.match(reg);
if(r==null)returnfalse;
vard=newDate(r[1],r[3]-1,r[4],r[5],r[6],r[7]);
return
(d.getFullYear()==r[1]&&(d.getMonth()+1)==r[3]&&d.getDate()==r[4]&&d.getHours()==r[5]&&d.getMinutes()==r[6]&&d.getSeconds()==
r[7]);
}
2.4只有年和月。形如(2003-05,或者2003-5)
2.5只有小时和分钟,形如(12:03)
3、表单类
3.1所有的表单的值都不能为空
<inputonblur="if(this.value.replace(/^\s+|\s+$/g,)==)alert(不能为空!)">
3.2多行文本框的值不能为空。
3.3多行文本框的值不能超过sMaxStrleng
3.4多行文本框的值不能少于sMixStrleng
3.5判断单选框是否选择。
3.6判断复选框是否选择.
3.7复选框的全选,多选,全不选,反选
3.8文件上传过程中判断文件类型
4、字符类
4.1判断字符全部由a-Z或者是A-Z的字字母组成
<inputonblur="if(/[^a-zA-Z]/g.test(this.value))alert(有错)">
4.2判断字符由字母和数字组成。
<inputonblur="if(/[^0-9a-zA-Z]/g.test(this.value))alert(有错)">
4.3判断字符由字母和数字,下划线,点号组成.且开头的只能是下划线和字母
/^([a-zA-z_]{1})([\w]*)$/g.test(str)
4.4字符串替换函数.Replace();
5、浏览器类
5.1判断浏览器的类型
window.navigator.appName
5.2判断ie的版本
window.navigator.appVersion
5.3判断客户端的分辨率
window.screen.height;window.screen.width;
6、结合类
6.1email的判断。
functionismail(mail)
{
return(newRegExp(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/).test(mail));
}
6.2手机号码的验证
6.3身份证的验证
functionisIdCardNo(num)
{
if(isNaN(num)){alert("输入的不是数字!");returnfalse;}
varlen=num.length,re;
if(len==15)
re=newRegExp(/^(\d{6})()?(\d{2})(\d{2})(\d{2})(\d{3})$/);
elseif(len==18)
re=newRegExp(/^(\d{6})()?(\d{4})(\d{2})(\d{2})(\d{3})(\d)$/);
else{alert("输入的数字位数不对!");returnfalse;}
vara=num.match(re);
if(a!=null)
{
if(len==15)
{
varD=newDate("19"+a[3]+"/"+a[4]+"/"+a[5]);
varB=D.getYear()==a[3]&&(D.getMonth()+1)==a[4]&&D.getDate()==a[5];
}
else
{
varD=newDate(a[3]+"/"+a[4]+"/"+a[5]);
varB=D.getFullYear()==a[3]&&(D.getMonth()+1)==a[4]&&D.getDate()==a[5];
}
if(!B){alert("输入的身份证号"+a[0]+"里出生日期不对!");returnfalse;}
}
returntrue;
}
3.7复选框的全选,多选,全不选,反选
<formname=hrong>
<inputtype=checkboxname=Allonclick="checkAll(mm)">全选<br/>
<inputtype=checkboxname=mmonclick="checkItem(All)"><br/>
<inputtype=checkboxname=mmonclick="checkItem(All)"><br/>
<inputtype=checkboxname=mmonclick="checkItem(All)"><br/>
<inputtype=checkboxname=mmonclick="checkItem(All)"><br/>
<inputtype=checkboxname=mmonclick="checkItem(All)"><br/><br/>
<inputtype=checkboxname=All2onclick="checkAll(mm2)">全选<br/>
<inputtype=checkboxname=mm2onclick="checkItem(All2)"><br/>
<inputtype=checkboxname=mm2onclick="checkItem(All2)"><br/>
<inputtype=checkboxname=mm2onclick="checkItem(All2)"><br/>
<inputtype=checkboxname=mm2onclick="checkItem(All2)"><br/>
<inputtype=checkboxname=mm2onclick="checkItem(All2)"><br/>
</form>
<SCRIPTLANGUAGE="JavaScript">
functioncheckAll(str)
{
vara=document.getElementsByName(str);
varn=a.length;
for(vari=0;i<n;i++)
a[i].checked=window.event.srcElement.checked;
}
functioncheckItem(str)
{
vare=window.event.srcElement;
varall=eval("document.hrong."+str);
if(e.checked)
{
vara=document.getElementsByName(e.name);
all.checked=true;
for(vari=0;i<a.length;i++)
{
if(!a[i].checked){all.checked=false;break;}
}
}
elseall.checked=false;
}
</SCRIPT>
3.8文件上传过程中判断文件类型
<inputtype=fileonchange="alert(this.value.match(/^(.*)(\.)(.{1,8})$/)[3])">
不断地清空剪贴板:
<bodyonload="setInterval(clipboardData.setData(\Text\,\\),100)">
<scriptlanguage="JavaScript"type="text/JavaScript">
//先复制一样东西,或者文本或者图片
if(clipboardData.getData("Text")||clipboardData.getData("HTML")||clipboardData.getData("URL"))
{
alert("有效行为");
}
</script>
全屏技术:
真正的全屏页面解决之道!(全代码)
真正全屏解决之道:
1.htm
<html>
<head>
<title>无标题文档</title>
<metahttp-equiv="Content-Type"content="text/html;charset=gb2312">
</head>
<bodyonload="window.open(fullscreen.htm,,fullscreen=1,scroll=no);">
</body>
</html>
fullscreen.htm
<html>
<head>
<title>无标题文档</title>
<metahttp-equiv="Content-Type"content="text/html;charset=gb2312">
<scriptlanguage="JavaScript1.2">
<!--
functionopensmallwin(myurl){
varw2=300;//想弹出窗口的宽度
varh2=100;//想弹出窗口的高度
varw3=window.screen.width/2-w2/2;
varh3=window.screen.height/2-h2/2;
window.open(myurl,small,toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=0,width=+w2+,height=+h2+,left=+w3+,top=+h3+);
}
//-->
<!--
functionmodelesswin(url,mwidth,mheight){
if(document.all&&window.print)
eval(window.showModelessDialog(url,"","help:0;resizable:0;status:0;center:1;scroll:0;dialogWidth:+mwidth+px;dialogHeight:+mheight+px"))
else
eval(window.open(url,"","width=+mwidth+px,height=+mheight+px,resizable=1,scrollbars=1"))
}
//-->
</script>
</head>
<bodyscroll="no">
<divalign="right"><ahref="javascript:"onclick="window.close()">关闭</a></div>
<p></P>
<divalign="right"><ahref="javascript:"onclick="opensmallwin(login.htm)">登录</a></div>
<p></P>
<divalign="center"><ahref="javascript:"onclick="modelesswin(login.htm,300,160)">用模态登录窗口</a></div>
</body>
</html>
login.htm
<html>
<head>
<title>用户登录</title>
<metahttp-equiv="Content-Type"content="text/html;charset=gb2312">
<styletype="text/css">
<!--
body{
background-color:#EAEAEA;
font-family:Arial,Helvetica,sans-serif;
font-size:12px;
line-height:24px;
color:#336699;
}
input.boxline{
width:100px;
font-family:"TimesNewRoman","Times","serif";
font-size:9pt;
border:1pxsolid#669999;
height:18px;
}
input.whiteline{
font-size:12px;border:1px#999999solid
}
-->
</style></head>
<bodyleftmargin="0"topmargin="0"marginwidth="0"marginheight="0">
<tablewidth="100%"height="100%"border="0"cellpadding="0"cellspacing="14"bgcolor="#CCCCCC">
<trvalign="top">
<tdwidth="10%"nowrapalign="right"><b>用户名:</b></td>
<tdwidth="90%"><inputname="textfield1"type="text"size="25"class="whiteline"></td>
</tr>
<trvalign="top">
<tdnowrapalign="right"><b>密码:</b></td>
<td><inputname="textfield12"type="password"size="25"class="whiteline"></td>
</tr>
<trvalign="top">
<td></td>
<td><inputtype="submit"name="Submit"value="登录"class="boxline"></td>
</tr>
</table>
</body>
</html>
自动关掉原窗口:
<html>
<head>
<title>无标题文档</title>
<metahttp-equiv="Content-Type"content="text/html;charset=gb2312">
<styletype="text/css">
<!--
body{
margin-left:0px;
margin-top:0px;
margin-right:0px;
margin-bottom:0px;
}
-->
</style>
</head>
<bodyonload="window.open(fullscreen.htm,,fullscreen=1,scroll=no);window.opener=null;window.close()">
<inputtype=buttonvalue=关闭onclick="window.opener=null;window.close()">
<!--IE5.5+不会有弹出提示-->
<OBJECTid=WebBrowserclassid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2height=0width=0></OBJECT>
<inputtype=buttonvalue=关闭窗口onclick=document.all.WebBrowser.ExecWB(45,1)>
</body>
</html>
关键是在onload事件中加入:
window.opener=null;window.close()
预读图片:
<SCRIPTLANGUAGE="JavaScript">
<!--Thisscriptandmanymoreareavailablefreeonlineat-->
<!--TheJavaScriptSource!!http://javascript.internet.com;-->
<!--Begin
image1=newImage();
image1.src="image1.gif";
image2=newImage();
image2.src="image2.gif";
//End-->
</script>
关于两个网页刷新交互的问题
JS处理方法:
a.htm
<ahref="b.htm"target=blank>发表留言</a>
<script>
alert("wwwwwwwwwwwwwwwwwwwwwwwwww");
</script>
b.htm
<scriptlanguage="javascript">
//window.opener.location.reload();刷新父窗口
//window.opener.location="2.htm"//重定向父窗口到2.htm页
functionclosewindow()
{
window.opener.location.reload();
self.close();
window.opener.document.write("sssssssssssssssssss");
}
</script>
<ahref="b.htm"target=blankonclick="closewindow();">关闭</a>
后台处理方法:
privatebtnForSubmit(Objectsender,EventArgse)
{
.............
Response.Write("<script>window.opener.document.execCommand(refresh);window.opener=;window.close();</script>");
//stringstr="<script>window.opener.document.execCommand(refresh);window.opener=;window.close();</script>";
//this.RegisterStartupScript("mycode",str);
showModalDialog()、showModelessDialog()方法使用详解
Javascript有许多内建的方法来产生对话框,如:window.alert(),window.confirm(),window.prompt().等。然而IE提供更多的方法支持对话框。如:
showModalDialog()(IE4+支持)
showModelessDialog()(IE5+支持)
window.showModalDialog()方法用来创建一个显示HTML内容的模态对话框,由于是对话框,因此它并没有一般用window.open()打开的窗口的所有属性。
window.showModelessDialog()方法用来创建一个显示HTML内容的非模态对话框。
当我们用showModelessDialog()打开窗口时,不必用window.close()去关闭它,当以非模态方式[IE5]打开时,打开对话框的窗口仍可以进行其他的操作,即对话框不总是最上面的焦点,当打开它的窗口URL改变时,它自动关闭。而模态[IE4]方式的对话框始终有焦点(焦点不可移走,直到它关闭)。模态对话框和打开它的窗口相联系,因此我们打开另外的窗口时,他们的链接关系依然保存,并且隐藏在活动窗口的下面。
使用方法如下:
vReturnValue=window.showModalDialog(sURL[,vArguments][,sFeatures])
vReturnValue=window.showModelessDialog(sURL[,vArguments][,sFeatures])
参数说明:
sURL
必选参数,类型:字符串。用来指定对话框要显示的文档的URL。
vArguments
可选参数,类型:变体。用来向对话框传递参数。传递的参数类型不限,包括数组等。对话框通过window.dialogArguments来取得传递进来的参数。
sFeatures
可选参数,类型:字符串。用来描述对话框的外观等信息,可以使用以下的一个或几个,用分号“;”隔开。
dialogHeight对话框高度,不小于100px,IE4中dialogHeight和dialogWidth默认的单位是em,而IE5中是px,为方便其见,在定义modal方式的对话框时,用px做单位。
dialogWidth:对话框宽度。
dialogLeft:距离桌面左的距离。
dialogTop:离桌面上的距离。
center:{yes|no|1|0}:窗口是否居中,默认yes,但仍可以指定高度和宽度。
help:{yes|no|1|0}:是否显示帮助按钮,默认yes。
resizable:{yes|no|1|0}[IE5+]:是否可被改变大小。默认no。
status:{yes|no|1|0}[IE5+]:是否显示状态栏。默认为yes[Modeless]或no[Modal]。
scroll:{yes|no|1|0|on|off}:指明对话框是否显示滚动条。默认为yes。
还有几个属性是用在HTA中的,在一般的网页中一般不使用。
dialogHide:{yes|no|1|0|on|off}:在打印或者打印预览时对话框是否隐藏。默认为no。
edge:{sunken|raised}:指明对话框的边框样式。默认为raised。
unadorned:{yes|no|1|0|on|off}:默认为no。
传入参数:
要想对话框传递参数,是通过vArguments来进行传递的。类型不限制,对于字符串类型,最大为4096个字符。也可以传递对象,例如:
test1.htm
====================
<script>
varmxh1=newArray("mxh","net_lover","孟子E章")
varmxh2=window.open("about:blank","window_mxh")
//向对话框传递数组
window.showModalDialog("test2.htm",mxh1)
//向对话框传递window对象
window.showModalDialog("test3.htm",mxh2)
</script>
test2.htm
====================
<script>
vara=window.dialogArguments
alert("您传递的参数为:"+a)
</script>
test3.htm
====================
<script>
vara=window.dialogArguments
alert("您传递的参数为window对象,名称:"+a.name)
</script>
可以通过window.returnValue向打开对话框的窗口返回信息,当然也可以是对象。例如:
test4.htm
===================
<script>
vara=window.showModalDialog("test5.htm")
for(i=0;i<a.length;i++)alert(a[i])
</script>
test5.htm
===================
<script>
functionsendTo()
{
vara=newArray("a","b")
window.returnValue=a
window.close()
}
</script>
<body>
<form>
<inputvalue="返回"type=buttononclick="sendTo()">
</form>
常见问题:
1,如何在模态对话框中进行提交而不新开窗口?
如果你的浏览器是IE5.5+,可以在对话框中使用带name属性的iframe,提交时可以制定target为该iframe的name。对于IE4+,你可以用高度为0的frame来作:例子,
test6.htm
===================
<script>
window.showModalDialog("test7.htm")
</script>
test7.htm
===================
if(window.location.search)alert(window.location.search)
<framesetrows="0,*">
<framesrc="about:blank">
<framesrc="test8.htm">
</frameset>
test8.htm
===================
<formtarget="_self"method="get">
<inputname=txtvalue="test">
<inputtype=submit>
</form>
<script>
if(window.location.search)alert(window.location.search)
</script>
2,可以通过http://servername/virtualdirname/test.htm?name=mxh方式直接向对话框传递参数吗?
答案是不能。但在frame里是可以的。
//屏蔽F5刷新键
functiondocument.onkeydown()
{
vark=window.event.keyCode;
if(k==116)//屏蔽F5刷新键
{
window.event.keyCode=0;
window.event.returnValue=false;
}
}
<scriptlanguage="Javascript">
//屏蔽鼠标右键、Ctrl+N、Shift+F10、F5刷新、退格键
//屏蔽F1帮助
functionwindow.onhelp()
{
returnfalse
}
functionKeyDown()
{
//alert(event.keyCode);
//屏蔽Alt+方向键←屏蔽Alt+方向键→
if((window.event.altKey)&&((window.event.keyCode==37)||(window.event.keyCode==39)))
{
//alert("不准你使用ALT+方向键前进或后退网页!");
event.returnValue=false;
}
//屏蔽退格删除键,屏蔽F5刷新键,Ctrl+R
if((event.keyCode==116)||(event.ctrlKey&&event.keyCode==82))
{
event.keyCode=0;
event.returnValue=false;
}
//屏蔽Ctrl+n
if((event.ctrlKey)&&(event.keyCode==78))
{
event.returnValue=false;
}
//屏蔽shift+F10
if((event.shiftKey)&&(event.keyCode==121))
{
event.returnValue=false;
}
//屏蔽shift加鼠标左键新开一网页
if(window.event.srcElement.tagName=="A"&&window.event.shiftKey)
{
window.event.returnValue=false;
}
//屏蔽Alt+F4
if((window.event.altKey)&&(window.event.keyCode==115))
{
window.showModelessDialog("about:blank","","dialogWidth:1px;dialogheight:1px");
returnfalse;
}
//屏蔽Ctrl+A
if((event.ctrlKey)&&(event.keyCode==65))
{
returnfalse;
}
}
</script>
</body>
</HTML>
<scriptlanguage="Javascript"><!--
document.onkeydown=function()
{
vark=window.event.keyCode;
if(k==116)//屏蔽F5刷新键
{
window.event.keyCode=0;
window.event.returnValue=false;
}
}
//--></script>
绝种好表格(JS+HTML)
单击表格对数据进行排序
[download]tuto_file/2004/3/31/200433111445554.rar[/download]
自由编辑表格
//===============================start================================
<HTML>
<HEAD>
<METAhttp-equiv="Content-Type"content="text/html;charset=gb2312">
<TITLE>测试修改表格</TITLE>
<STYLE>
/*提示层的样式*/
div
{
BORDER-RIGHT:#80c1441pxsolid;
BORDER-TOP:#80c1441pxsolid;
VISIBILITY:hidden;
BORDER-LEFT:#80c1441pxsolid;
CURSOR:default;
LINE-HEIGHT:20px;
BORDER-BOTTOM:#80c1441pxsolid;
FONT-FAMILY:宋体;
font-size:12px;
POSITION:absolute;
BACKGROUND-COLOR:#f6f6f6;
TOP:30px;
LEFT:30px;
}
/*tr的样式*/
tr
{
font-family:"宋体";
color:#000000;
background-color:#C1DBF5;
font-size:12px
}
/*table脚注样式*/
.TrFoot
{
FONT-SIZE:12px;
font-family:"宋体","Verdana","Arial";
BACKGROUND-COLOR:#6699CC;
COLOR:#FFFFFF;
height:25;
}
/*trhead属性*/
.TrHead
{
FONT-SIZE:13px;
font-family:"宋体","Verdana","Arial";
BACKGROUND-COLOR:#77AADD;
COLOR:#FFFFFF;
height:25;
}
/*文本框样式*/
INPUT
{
BORDER-COLOR:#AACEF7#AACEF7#AACEF7#AACEF7;
BORDER-RIGHT:1pxsolid;
BORDER-TOP:1pxsolid;
BORDER-LEFT:1pxsolid;
BORDER-BOTTOM:1pxsolid;
FONT-SIZE:12px;
FONT-FAMILY:"宋体","Verdana";
color:#000000;
BACKGROUND-COLOR:#E9EFF5;
}
/*button样式*/
button
{
BORDER-COLOR:#AACEF7#AACEF7#AACEF7#AACEF7;
BACKGROUND-COLOR:#D5E4F3;
CURSOR:hand;
FONT-SIZE:12px;
BORDER-RIGHT:1pxsolid;
BORDER-TOP:1pxsolid;
BORDER-LEFT:1pxsolid;
BORDER-BOTTOM:1pxsolid;
COLOR:#000000;
}
</STYLE>
</HEAD>
<BODY>
<SCRIPTlanguage="JavaScript">
<!--全局变量
//标志位,值为false代表未打开一个编辑框,值为true为已经打开一个编辑框开始编辑
varediter_table_cell_tag=false;
//开启编辑功能标志,值为true时为允许编辑
varrun_edit_flag=false;
//-->
</SCRIPT>
<SCRIPTlanguage="JavaScript">
<!--
/**
*编辑表格函数
*单击某个单元格可以对里面的内容进行自由编辑
*@paratableID为要编辑的table的id
*@paranoEdiID为不要编辑的td的ID,比如说table的标题
*可以写为<TDid="no_editer">自由编辑表格</TD>
*此时该td不可编辑
*/
functionediterTableCell(tableId,noEdiId)
{
vartdObject=event.srcElement;
vartObject=((tdObject.parentNode).parentNode).parentNode;
if(tObject.id==tableId&&tdObject.id!=noEdiId&&editer_table_cell_tag==false&&run_edit_flag==true)
{
tdObject.innerHTML="<inputtype=textid=edit_table_txtname=edit_table_txtvalue="+tdObject.innerText+"size=15onKeyDown=enterToTab()><inputtype=buttonvalue=确定onclick=certainEdit()>";
edit_table_txt.focus();
edit_table_txt.select();
editer_table_cell_tag=true;
//修改按钮提示信息
editTip.innerText="请先点确定按钮确认修改!";
}
else
{
returnfalse;
}
}
/**
*确定修改
*/
functioncertainEdit()
{
varbObject=event.srcElement;
vartdObject=bObject.parentNode;
vartxtObject=tdObject.firstChild;
tdObject.innerHTML=txtObject.value;
//代表编辑框已经关闭
editer_table_cell_tag=false;
//修改按钮提示信息
editTip.innerText="请单击某个单元格进行编辑!";
}
functionenterToTab()
{
if(event.srcElement.type!=button&&event.srcElement.type!=textarea
&&event.keyCode==13)
{
event.keyCode=9;
}
}
/**
*控制是否编辑
*/
functioneditStart()
{
if(event.srcElement.value=="开始编辑")
{
event.srcElement.value="编辑完成";
run_edit_flag=true;
}
else
{
//如果当前没有编辑框,则编辑成功,否则,无法提交
//必须按确定按钮后才能正常提交
if(editer_table_cell_tag==false)
{
alert("编辑成功结束!");
event.srcElement.value="开始编辑";
run_edit_flag=false;
}
}
}
/**
*根据不同的按钮提供不同的提示信息
*/
functionshowTip()
{
if(event.srcElement.value=="编辑完成")
{
editTip.style.top=event.y+15;
editTip.style.left=event.x+12;
editTip.style.visibility="visible";
}
else
{
editTip.style.visibility="hidden";
}
}
-->
</SCRIPT>
<TABLEid="editer_table"width="100%"align="center"
onclick="editerTableCell(editer_table,no_editer)">
<TRclass="TrHead">
<TDcolspan="3"align="center"id="no_editer">自由编辑表格</TD>
</TR>
<TR>
<TDwidth="33%">单击开始编辑按钮,然后点击各单元格编辑</TD>
<TDwidth="33%">2</TD>
<TDwidth="33%">3</TD>
</TR>
<TR>
<TDwidth="33%">4</TD>
<TDwidth="33%">5</TD>
<TDwidth="33%">6</TD>
</TR>
<TR>
<TDwidth="33%">one</TD>
<TDwidth="33%">two</TD>
<TDwidth="33%">three</TD>
</TR>
<TR>
<TDwidth="33%">four</TD>
<TDwidth="33%">five</TD>
<TDwidth="33%">six</TD>
</TR>
<TRclass="TrFoot">
<TDcolspan="3"align="center"id="no_editer">
<INPUTtype="button"class="bt"value="开始编辑"onClick="editStart()"onMouseOver="showTip()"onMouseMove="showTip()"onMouseOut="editTip.style.visibility=hidden;">
</TD>
</TR>
</TABLE>
</BODY>
<DIVid="editTip">请单击某个单元格进行编辑!</DIV>
</HTML>
验证ip
str=document.RegExpDemo.txtIP.value;
if(/^(\d{1,3})\.(\d{1,3})\.(\d{1,3})\.(\d{1,3})$/.test(str)==false)
{
window.alert(错误的IP地址格式);
document.RegExpDemo.txtIP.select();
document.RegExpDemo.txtIP.focus();
return;
}
if(RegExp.$1<1||RegExp.$1>254||RegExp.$2<0||RegExp.$2>254||RegExp.$3<0||RegExp.$3>254||RegExp.$4<1||RegExp.$4>254)
{
window.alert(错误的IP地址);
document.RegExpDemo.txtIP.select();
document.RegExpDemo.txtIP.focus();
return;
}
//剔除如010.020.020.03前面的0
varstr=str.replace(/0(\d)/g,"$1");
str=str.replace(/0(\d)/g,"$1");
window.alert(str);
升降序排列数据(表格)
//一下是取数据的类
//Obj参数指定数据的来源(限定Table),默认第一行为字段名称行
//GetTableData类提供MoveNext方法,参数是表的行向上或向下移动的位数,正数向下移动,负数向上.
//GetFieldData方法获得指定的列名的数据
//Sort_desc方法对指定的列按降序排列
//Sort_asc方法对指定的列按升序排列
//GetData方法返回字段值为特定值的数据数组,提供数据,可以在外部进行其他处理
//Delete方法删除当前记录,数组减少一行
//初始化,Obj:table的名字,Leftlen:左面多余数据长度,Rightlen:右面多余数据长度,
functionGetTableData(Obj,LeftLen,RightLen){
varMyObj=document.all(Obj);
variRow=MyObj.rows.length;
variLen=MyObj.rows[0].cells.length;
vari,j;
TableData=newArray();
for(i=0;i<iRow;i++){
TableData[i]=newArray();
for(j=0;j<iLen;j++){
TableStr=MyObj.rows(i).cells(j).innerText;
TableStr=TableStr.substring(LeftLen,TableStr.length-RightLen).Trim();
TableStr=TableStr.replace(//gi,"").replace(/\r\n/ig,"");
TableData[i][j]=TableStr;
}
}
this.TableData=TableData;
this.cols=this.TableData[0].length;
this.rows=this.TableData.length;
this.rowindex=0;
}
functionmovenext(Step){
if(this.rowindex>=this.rows){
return
}
if(Step==""||typeof(Step)=="undefined"){
if(this.rowindex<this.rows-1)
this.rowindex++;
return;
}
else{
if(this.rowindex+Step<=this.rows-1&&this.rowindex+Step>=0){
this.rowindex=this.rowindex+Step;
}
else
{
if(this.rowindex+Step<0){
this.rowindex=0;
return;
}
if(this.rowindex+Step>this.rows-1){
this.rowindex=this.rows-1;
return;
}
}
}
}
functiongetfielddata(Field){
varcolindex=-1;
vari=0;
if(typeof(Field)=="number"){
colindex=Field;
}
else
{
for(i=0;i<this.cols&&this.rowindex<this.rows;i++){
if(this.TableData[0][i]==Field){
colindex=i;
break;
}
}
}
if(colindex!=-1){
returnthis.TableData[this.rowindex][colindex];
}
}
functionsort_desc(){//降序
varcolindex=-1;
varhighindex=-1;
desc_array=newArray();
vari,j;
for(n=0;n<arguments.length;n++){
Field=arguments[arguments.length-1-n];
for(i=0;i<this.cols;i++){
if(this.TableData[0][i]==Field){
colindex=i;
break;
}
}
if(colindex==-1)
return;
else
{
desc_array[0]=this.TableData[0];
for(i=1;i<this.rows;i++){
desc_array[i]=this.TableData[1];
highindex=1;
for(j=1;j<this.TableData.length;j++){
if(desc_array[i][colindex]<this.TableData[j][colindex]){
desc_array[i]=this.TableData[j];
highindex=j;
}
}
if(highindex!=-1)
this.TableData=this.TableData.slice(0,highindex).concat(this.TableData.slice(highindex+1,this.TableData.length));
}
}
this.TableData=desc_array;
}
return;
}
functionsort_asc(){//升序
varcolindex=-1;
varhighindex=-1;
vari,j;
for(n=0;n<arguments.length;n++){
asc_array=newArray();
Field=arguments[arguments.length-1-n];
for(i=0;i<this.cols;i++){
if(this.TableData[0][i]==Field){
colindex=i;
break;
}
}
if(colindex==-1)
return;
else
{
asc_array[0]=this.TableData[0];
for(i=1;i<this.rows;i++){
asc_array[i]=this.TableData[1];
highindex=1;
for(j=1;j<this.TableData.length;j++){//找出最小的列值
if(asc_array[i][colindex]>this.TableData[j][colindex]){
asc_array[i]=this.TableData[j];
highindex=j;
}
}
if(highindex!=-1)
this.TableData=this.TableData.slice(0,highindex).concat(this.TableData.slice(highindex+1,this.TableData.length));
}
}
this.TableData=asc_array;
}
return;
}
functiongetData(Field,FieldValue){
varcolindex=-1;
vari,j;
GetData=newArray();
if(typeof(Field)=="undefined"||typeof(FieldValue)=="undefined"){
returnthis.TableData;
}
for(j=0;j<this.cols;j++){
if(this.TableData[0][j]==Field){
colindex=j;
}
}
if(colindex!=-1){
for(i=1;i<this.rows;i++){
if(this.TableData[i][colindex]==FieldValue){
GetData[i]=newArray();
GetData[i]=this.TableData[i];
}
}
}
returnGetData;
}
functionDeletE(){
this.TableData=this.TableData.slice(0,this.rowindex).concat(this.TableData.slice(this.rowindex+1,this.TableData.length));
this.rows=this.TableData.length;
return;
}
functionupdateField(Field,FieldValue){
varcolindex=-1;
vari=0;
if(typeof(Field)=="number"){
colindex=Field;
}
else
{
for(i=0;i<this.cols&&this.rowindex<this.rows;i++){
if(this.TableData[0][i]==Field){
colindex=i;
break;
}
}
}
if(colindex!=-1){
this.TableData[this.rowindex][colindex]=FieldValue;
}
}
functionmovefirst(){
this.rowindex=0;
}
functionmovelast(){
this.rowindex=this.rows-1;
}
functionString.prototype.Trim(){returnthis.replace(/(^\s*)|(\s*$)/g,"");}
GetTableData.prototype.MoveNext=movenext;
GetTableData.prototype.GetFieldData=getfielddata;
GetTableData.prototype.Sort_asc=sort_asc;
GetTableData.prototype.Sort_desc=sort_desc;
GetTableData.prototype.GetData=getData;
GetTableData.prototype.Delete=DeletE;
GetTableData.prototype.UpdateField=updateField;
GetTableData.prototype.MoveFirst=movefirst;
具体的例子:http://202.119.73.208/NetEAn/com/test/jsprint.htm;
在每个文本框的onblur事件中调用校验代码,并且每个文本框中onKeyDown事件中写一个enter转tab函数
//回车键换为tab
functionenterToTab()
{
if(event.srcElement.type!=button&&event.srcElement.type!=textarea
&&event.keyCode==13)
{
event.keyCode=9;
}
}
固定表头技术(表格)
方法一、
用上下两个框架啊上面的框架读“表头”,下面的框架读“内容”,如:
<framesetrows="55,*"framespacing="0">
<framename="head"scrolling="no"frameborder="0"border="0"noresizesrc="表头.htm">
<framename="main"scrolling="auto"frameborder="0"border="0"noresizesrc="内容.htm">
</frameset>
方法二、
用脚本:
<body>
<scriptlanguage=JavaScript>
self.onError=null;
currentX=currentY=0;
whichIt=null;
lastScrollX=0;lastScrollY=0;
NS=(document.layers)?1:0;
IE=(document.all)?1:0;
<!--STALKERCODE-->
functionheartBeat(){
if(IE){diffY=document.body.scrollTop;diffX=document.body.scrollLeft;}
if(NS){diffY=self.pageYOffset;diffX=self.pageXOffset;}
if(diffY!=lastScrollY){
percent=.1*(diffY-lastScrollY);
if(percent>0)percent=Math.ceil(percent);
elsepercent=Math.floor(percent);
if(IE)document.all.floater.style.pixelTop+=percent;
if(NS)document.floater.top+=percent;
lastScrollY=lastScrollY+percent;
}
if(diffX!=lastScrollX){
percent=.1*(diffX-lastScrollX);
if(percent>0)percent=Math.ceil(percent);
elsepercent=Math.floor(percent);
if(IE)document.all.floater.style.pixelLeft+=percent;
if(NS)document.floater.left+=percent;
lastScrollX=lastScrollX+percent;
}
}
<!--/STALKERCODE-->
<!--DRAGDROPCODE-->
functioncheckFocus(x,y){
stalkerx=document.floater.pageX;
stalkery=document.floater.pageY;
stalkerwidth=document.floater.clip.width;
stalkerheight=document.floater.clip.height;
if((x>stalkerx&&x<(stalkerx+stalkerwidth))&&(y>stalkery&&y<(stalkery+stalkerheight)))returntrue;
elsereturnfalse;
}
functiongrabIt(e){
if(IE){
whichIt=event.srcElement;
while(whichIt.id.indexOf("floater")==-1){
whichIt=whichIt.parentElement;
if(whichIt==null){returntrue;}
}
whichIt.style.pixelLeft=whichIt.offsetLeft;
whichIt.style.pixelTop=whichIt.offsetTop;
currentX=(event.clientX+document.body.scrollLeft);
currentY=(event.clientY+document.body.scrollTop);
}else{
window.captureEvents(Event.MOUSEMOVE);
if(checkFocus(e.pageX,e.pageY)){
whichIt=document.floater;
StalkerTouchedX=e.pageX-document.floater.pageX;
StalkerTouchedY=e.pageY-document.floater.pageY;
}
}
returntrue;
}
functionmoveIt(e){
if(whichIt==null){returnfalse;}
if(IE){
newX=(event.clientX+document.body.scrollLeft);
newY=(event.clientY+document.body.scrollTop);
distanceX=(newX-currentX);distanceY=(newY-currentY);
currentX=newX;currentY=newY;
whichIt.style.pixelLeft+=distanceX;
whichIt.style.pixelTop+=distanceY;
if(whichIt.style.pixelTop<document.body.scrollTop)whichIt.style.pixelTop=document.body.scrollTop;
if(whichIt.style.pixelLeft<document.body.scrollLeft)whichIt.style.pixelLeft=document.body.scrollLeft;
if(whichIt.style.pixelLeft>document.body.offsetWidth-document.body.scrollLeft-whichIt.style.pixelWidth-20)whichIt.style.pixelLeft=document.body.offsetWidth-whichIt.style.pixelWidth-20;
if(whichIt.style.pixelTop>document.body.offsetHeight+document.body.scrollTop-whichIt.style.pixelHeight-5)whichIt.style.pixelTop=document.body.offsetHeight+document.body.scrollTop-whichIt.style.pixelHeight-5;
event.returnValue=false;
}else{
whichIt.moveTo(e.pageX-StalkerTouchedX,e.pageY-StalkerTouchedY);
if(whichIt.left<0+self.pageXOffset)whichIt.left=0+self.pageXOffset;
if(whichIt.top<0+self.pageYOffset)whichIt.top=0+self.pageYOffset;
if((whichIt.left+whichIt.clip.width)>=(window.innerWidth+self.pageXOffset-17))whichIt.left=((window.innerWidth+self.pageXOffset)-whichIt.clip.width)-17;
if((whichIt.top+whichIt.clip.height)>=(window.innerHeight+self.pageYOffset-17))whichIt.top=((window.innerHeight+self.pageYOffset)-whichIt.clip.height)-17;
returnfalse;
}
returnfalse;
}
functiondropIt(){
whichIt=null;
if(NS)window.releaseEvents(Event.MOUSEMOVE);
returntrue;
}
<!--DRAGDROPCODE-->
if(NS){
window.captureEvents(Event.MOUSEUP|Event.MOUSEDOWN);
window.onmousedown=grabIt;
window.onmousemove=moveIt;
window.onmouseup=dropIt;
}
if(IE){
document.onmousedown=grabIt;
document.onmousemove=moveIt;
document.onmouseup=dropIt;
}
if(NS||IE)action=window.setInterval("heartBeat()",1);
</script>
<divid="floater"style="position:absolute;width:94px;height:55px;z-index:10;left:200x;top:233px">将你的文字或图片放在此处</div>
</body>
处理数据:
我想要113.23534543256435这个数的整数部分,用什么函数??
答:
方法一、
<scriptlanguage="JavaScript">
vari;
i=parseInt(113.23534543256435);
alert(i);
</script>
方法二、
<inputtype="text"name="t1"value="113.23534543256435">
<scriptlanguage="JavaScript">
<!--
varstr=t1.value;
varnum=str.split(".");
alert(num[0])
//-->
</script>
方法三、
Math.floor(12.12)
Math.ceil(12.12)-1
方法四、
<%
a=1.24564641134654
response.writefix(a)
%>
方法五、
关于数值取舍,精度的问题详见MSDN
下面的Number对象的方法仅适用于IE5.5及以上版本
-------------------------------
这里举一个取舍小数的例子(保留两位小数,四舍五入)
varn=newNumber(113.23534543256435);
alert(n.toFixed(2));
另外,还有指数
varn=newNumber(113.23534543256435);
alert(n.toExponential(2));
关于SELECT列表框添加值的问题
示例代码1、
<script>
functionaddToSel(value){
if(value.length==0)return;
varoOpt=document.createElement("option");
oOpt.value=value;
oOpt.innerText=value;
sel.appendChild(oOpt);
}
</script>
<selectid=sel>
</select>
<inputtype=textid=txt>
<inputtype=buttonvalue=addtoselonclick="addToSel(txt.value)">
示例代码2、
<html>
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=gb2312">
<title>新建网页1</title>
</head>
<body>
<inputtype="button"id="btn"onclick="addItem()">
<selectid="slt">
</select>
<inputtype="text"id="txt">
<scriptlanguage="javascript">
<!--
functionaddItem()
{
slt.options[slt.options.length]=newOption(txt.value,txt.value);
}
//-->
</script>
</body>
</html>
屏闭一些键:
functionKeyDown(){//屏蔽鼠标右键、Ctrl+n、shift+F10、F5刷新、退格键
//alert("ASCII代码是:"+event.keyCode);
if((window.event.altKey)&&
((window.event.keyCode==37)||//屏蔽Alt+方向键←
(window.event.keyCode==39))){//屏蔽Alt+方向键→
alert("不准你使用ALT+方向键前进或后退网页!");
event.returnValue=false;
}
if((event.keyCode==8)||//屏蔽退格删除键
(event.keyCode==116)||//屏蔽F5刷新键
(event.keyCode==112)||//屏蔽F1刷新键
(event.ctrlKey&&event.keyCode==82)){//Ctrl+R
event.keyCode=0;
event.returnValue=false;
}
if((event.ctrlKey)&&(event.keyCode==78))//屏蔽Ctrl+n
event.returnValue=false;
if((event.shiftKey)&&(event.keyCode==121))//屏蔽shift+F10
event.returnValue=false;
if(window.event.srcElement.tagName=="A"&&window.event.shiftKey)
window.event.returnValue=false;//屏蔽shift加鼠标左键新开一网页
if((window.event.altKey)&&(window.event.keyCode==115)){//屏蔽Alt+F4
window.showModelessDialog("about:blank","","dialogWidth:1px;dialogheight:1px");
returnfalse;}
}
1.oncontextmenu="window.event.returnvalue=false"将彻底屏蔽鼠标右键
2.<bodyonselectstart="returnfalse">取消选取、防止复制
3.onpaste="returnfalse"不准粘贴
4.oncopy="returnfalse;"oncut="returnfalse;"防止复制;防止剪切
5.<linkrel="ShortcutIcon"href="favicon.ico">IE地址栏前换成自己的图标
6.<linkrel="Bookmark"href="favicon.ico">可以在收藏夹中显示出你的图标
7.<inputstyle="ime-mode:disabled">关闭输入法
8.永远都会带着框架
<scriptlanguage="javascript"><!--
if(window==top)
top.location.href="frames.htm";file://frames.htm为框架网页
//--></script>
9.防止被人frame
<SCRIPTLANGUAGE=javascript><!--
if(top.location!=self.location)
top.location=self.location;
//--></SCRIPT>
10.<noscript><iframesrc=*.html></iframe></noscript>网页将不能被另存为
1、去掉窗口滚动条
scroll="no"style="overflow-y:hidden"
2、背景图不再平铺
<style>body{background-image:url(logo.gif);background-repeat:no-repeat;background-position:center}
</style>
3、背景图不再滚动
IE浏览器支持一个Body属性bgproperties,它可以让背景不滚动:
<BodyBackground="图片文件"bgproperties="fixed">
4、设置flash背景为透明
wmode=transparent
5、让IFRAME框架内的文档的背景透明
<iframesrc="你要加入的页面"allowtransparency="true"></iframe>
下面这一句加在你要嵌入的页面中:
<bodystyle=background:transparent>
6、表格也可透明
table{background-color:#996600;filter:Alpha(Opacity=40,Style=0)}
注意:这样加入会影响表格内的图片文字等内容,大家可以这样解决,如下:
<tablewidth="75%"border="1"height="316">
<tr>
<td><spanstyle="position:relative;left:0px;top:0px">throughatop-down,
proactiveapproachwecanremaincustomerfocusedandgoal-directed,innovate
an</span></td>
<tdbgcolor="#993300">
<divalign="center"><spanstyle="position:relative;left:0px;top:0px"><imgsrc="box.gif"width="100"
height="100"></span></div>
</td>
<td><spanstyle="position:relative;left:0px;top:0px">throughatop-down,
proactiveapproachwecanremaincustomerfocusedandgoal-directed,innovate
an</span></td>
,;</tr>
</table>


