一些常见的问题与解决代码!(精典) 1
window.close()怎样使得关闭窗口时,ie不弹出确认对话框
<input type="button" onClick="window.opener='xxx';window.close();" value="IE6最简单的无提示关闭窗口" >
判断分辨率
<script>
alert(screen.width+'*'+screen.height)
</script>
图片滚动
<HTML>
<HEAD>
<TITLE>滚动效果</TITLE>
</HEAD>
<BODY>
<table>
<tr><td style="padding: 5">
<div id="testDiv" style="border: buttonface 2 solid">
<img src=http://be10.ods.org/51js/images/standard/51js.gif>这可以是任意的内容
</div>
<script language="JScript">
function scroll(obj, oWidth, oHeight, direction, drag, zoom, speed)
{
var scrollDiv = obj
var scrollContent = document.createElement("span")
scrollContent.style.position = "absolute"
scrollDiv.applyElement(scrollContent, "inside")
var displayWidth = (oWidth != "auto" && oWidth ) ? oWidth : scrollContent.offsetWidth + parseInt(scrollDiv.currentStyle.borderRightWidth)
var displayHeight = (oHeight != "auto" && oHeight) ? oHeight : scrollContent.offsetHeight + parseInt(scrollDiv.currentStyle.borderBottomWidth)
var contentWidth = scrollContent.offsetWidth
var contentHeight = scrollContent.offsetHeight
var scrollXItems = Math.ceil(displayWidth / contentWidth) + 1
var scrollYItems = Math.ceil(displayHeight / contentHeight) + 1
scrollDiv.style.width = displayWidth
scrollDiv.style.height = displayHeight
scrollDiv.style.overflow = "hidden"
scrollDiv.setAttribute("state", "stop")
scrollDiv.setAttribute("drag", drag ? drag : "horizontal")
scrollDiv.setAttribute("direction", direction ? direction : "left")
scrollDiv.setAttribute("zoom", zoom ? zoom : 1)
scrollContent.style.zoom = scrollDiv.zoom
var scroll_script = "var scrollDiv = " + scrollDiv.uniqueID +"\n"+
"var scrollObj = " + scrollContent.uniqueID +"\n"+
"var contentWidth = " + contentWidth + " * (scrollObj.runtimeStyle.zoom ? scrollObj.runtimeStyle.zoom : 1)" +"\n"+
"var contentHeight = " + contentHeight + " * (scrollObj.runtimeStyle.zoom ? scrollObj.runtimeStyle.zoom : 1)" +"\n"+
"var scrollx = scrollObj.runtimeStyle.pixelLeft" +"\n"+
"var scrolly = scrollObj.runtimeStyle.pixelTop" +"\n"+
"switch (scrollDiv.state.toLowerCase())" +"\n"+
"{" +"\n"+
"case ('scroll') :" +"\n"+
"switch (scrollDiv.direction)" +"\n"+
"{" +"\n"+
"case ('left') :" +"\n"+
"scrollx = (--scrollx) % contentWidth" +"\n"+
"break" +"\n"+
"case ('right') :" +"\n"+
"scrollx = -contentWidth + (++scrollx) % contentWidth" +"\n"+
"break" +"\n"+
"case ('up') :" +"\n"+
"scrolly = (--scrolly) % contentHeight" +"\n"+
"break" +"\n"+
"case ('down') :" +"\n"+
"scrolly = -contentHeight + (++scrolly) % contentHeight" +"\n"+
"break" +"\n"+
"case ('left_up') :" +"\n"+
"scrollx = (--scrollx) % contentWidth" +"\n"+
"scrolly = (--scrolly) % contentHeight" +"\n"+
"break" +"\n"+
"case ('left_down') :" +"\n"+
"scrollx = (--scrollx) % contentWidth" +"\n"+
"scrolly = -contentHeight + (++scrolly) % contentHeight" +"\n"+
"break" +"\n"+
"case ('right_up') :" +"\n"+
"scrollx = -contentWidth + (++scrollx) % contentWidth" +"\n"+
"scrolly = (--scrolly) % contentHeight" +"\n"+
"break" +"\n"+
"case ('right_down') :" +"\n"+
"scrollx = -contentWidth + (++scrollx) % contentWidth" +"\n"+
"scrolly = -contentHeight + (++scrolly) % contentHeight" +"\n"+
"break" +"\n"+
"default :" +"\n"+
"return" +"\n"+
"}" +"\n"+
"scrollObj.runtimeStyle.left = scrollx" +"\n"+
"scrollObj.runtimeStyle.top = scrolly" +"\n"+
"break" +"\n"+
"case ('stop') :" +"\n"+
"case ('drag') :" +"\n"+
"default :" +"\n"+
"return" +"\n"+
"}"
var contentNode = document.createElement("span")
contentNode.runtimeStyle.position = "absolute"
contentNode.runtimeStyle.width = contentWidth
scrollContent.applyElement(contentNode, "inside")
for (var i=0; i <= scrollXItems; i++)
{
for (var j=0; j <= scrollYItems ; j++)
{
if (i+j == 0) continue
var tempNode = contentNode.cloneNode(true)
var contentLeft, contentTop
scrollContent.insertBefore(tempNode)
contentLeft = contentWidth * i
contentTop = contentHeight * j
tempNode.runtimeStyle.left = contentLeft
tempNode.runtimeStyle.top = contentTop
}
}
scrollDiv.onpropertychange = function()
{
var propertyName = window.event.propertyName
var propertyValue = eval("this." + propertyName)
switch(propertyName)
{
case "zoom" :
var scrollObj = this.children[0]
scrollObj.runtimeStyle.zoom = propertyValue
var content_width = scrollObj.children[0].offsetWidth * propertyValue
var content_height = scrollObj.children[0].offsetHeight * propertyValue
scrollObj.runtimeStyle.left = -content_width + (scrollObj.runtimeStyle.pixelLeft % content_width)
scrollObj.runtimeStyle.top = -content_height + (scrollObj.runtimeStyle.pixelTop % content_height)
break
}
}
scrollDiv.onlosecapture = function()
{
this.state = this.tempState ? this.tempState : this.state
this.runtimeStyle.cursor = ""
this.removeAttribute("tempState")
this.removeAttribute("start_x")
this.removeAttribute("start_y")
this.removeAttribute("default_left")
this.removeAttribute("default_top")
}
scrollDiv.onmousedown = function()
{
if (this.state != "drag") this.setAttribute("tempState", this.state)
this.state = "drag"
this.runtimeStyle.cursor = "default"
this.setAttribute("start_x", event.clientX)
this.setAttribute("start_y", event.clientY)
this.setAttribute("default_left", this.children[0].style.pixelLeft)
this.setAttribute("default_top", this.children[0].style.pixelTop)
this.setCapture()
}
scrollDiv.onmousemove = function()
{
if (this.state != "drag") return
var scrollx = scrolly = 0
var zoomValue = this.children[0].style.zoom ? this.children[0].style.zoom : 1
var content_width = this.children[0].children[0].offsetWidth * zoomValue
var content_Height = this.children[0].children[0].offsetHeight * zoomValue
if (this.drag == "horizontal" || this.drag == "both")
{
scrollx = this.default_left + event.clientX - this.start_x
scrollx = -content_width + scrollx % content_width
this.children[0].runtimeStyle.left = scrollx
}
if (this.drag == "vertical" || this.drag == "both")
{
scrolly = this.default_top + event.clientY - this.start_y
scrolly = -content_Height + scrolly % content_Height
this.children[0].runtimeStyle.top = scrolly
}
}
scrollDiv.onmouseup = function()
{
this.releaseCapture()
}
scrollDiv.state = "scroll"
setInterval(scroll_script, speed ? speed : 20)
}
</script>
<script language="JScript">
window.onload = new Function("scroll(document.all['testDiv'], 325)")
</script>
<br>
<button onclick="testDiv.direction='up'; testDiv.state='scroll'"><span style="font-family: Webdings">5</span>向上</button>
<button onclick="testDiv.direction='left'; testDiv.state='scroll'"><span style="font-family: Webdings">3</span>向左</button>
<button onclick="testDiv.state='stop'"><span style="font-family: Webdings">;</span>停止</button>
<button onclick="testDiv.state='scroll'"><span style="font-family: Webdings">8</span>播放</button>
<button onclick="testDiv.direction='right'; testDiv.state='scroll'"><span style="font-family: Webdings">4</span>向右</button>
<button onclick="testDiv.direction='down'; testDiv.state='scroll'"><span style="font-family: Webdings">6</span>向下</button>
<br>
缩放:
<select onchange="testDiv.zoom = this.options[selectedIndex].value">
<option value=1>100%</option>
<option value=2>200%</option>
<option value=3>300%</option>
</select>
托动范围:
<select onchange="testDiv.drag = this.options[selectedIndex].value">
<option value="both">随意</option>
<option value="horizontal" selected>横向</option>
<option value="vertical">纵向</option>
</select>
</td></tr>
</table>
</BODY>
</HTML>
按button粘贴到text里
<SCRIPT>
var a="bbbb";
window.clipboardData.setData("text",a)
</SCRIPT>
到这里粘贴试试?<input type=text id=text1>
<button onclick="text1.value=window.clipboardData.getData('text')">Paste</button>
打印网页中的某一个区域
要打印的部分,前后各加个“<!--startprint-->”,“<!--endprint-->”,然后,写个按钮或者是什么的调用以下函数,比如:
<input type="button" name="aa" onclick="preview()">
<script language=javascript>
function preview() {
bdhtml=window.document.body.innerHTML;
sprnstr="<!--startprint-->";
eprnstr="<!--endprint-->";
prnhtml=bdhtml.substr(bdhtml.indexOf(sprnstr)+17);
prnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr));
window.document.body.innerHTML=prnhtml;
window.print();
}
</script>
关闭窗口三种办法
方法一:window.close();
通常情况下:window.opener=null;window.close();都是可行的。
方法二:
<object id=hh1 classid="clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11">
<param name="Command" value="Minimize"></object>
<object id=hh2 classid="clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11">
<param name="Command" value="Maximize"></object>
<OBJECT id=hh3 classid="clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11">
<PARAM NAME="Command" VALUE="Close"></OBJECT>
<input type=button value=最小化 onclick=hh1.Click()>
<input type=button value=最大化 onclick=hh2.Click()>
<input type=button value=关闭 onclick=hh3.Click()>
本例适用于IE
但在通常的网页中,结果是:“仅在HTML帮助中才有此功能”!
方法三:
<OBJECT id=WebBrowser classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2
height=0 width=0></OBJECT>
让标题动态
<script>
<!--
var tx = new Array (
"◇:::::::网页制作学习园地:::::::◇欢迎您!◇",
"◆欢迎大家光临网页制作学习园地网站!◆",
"◆大量供应网页制作教材,资料,源代码,网页制作软件,相关插件光盘!◆",
"◆最可怕的敌人,就是没有坚强的信念!◆",
"◆应该让别人的生活因为有了你的生存而更加美好!◆"
);
var txcount=5;
var i=1;
var wo=0;
var ud=1;
function animatetitle()
{
window.document.title=tx[wo].substr(0, i)+"_";
if (ud==0) i--;
if (ud==1) i++;
if (i==-1) {ud=1;i=0;wo++;wo=wo%txcount;}
if (i==tx[wo].length+10) {ud=0;i=tx[wo].length;}
// if (window.document.title.length < 20 ) window.document.title=window.document.title+"-";
// if (window.document.title.length == 20 ) window.document.title=window.document.title+"]";
// if (window.document.title.length == 21 ) setTimeout("window.document.title='Animierte Seitentitel '; ",1000);
parent.window.document.title=tx[wo].substr(0, i)+"_";
setTimeout("animatetitle()",100);
}
animatetitle();
// --></script><script language="JavaScript">
<!--
function MM_openBrWindow(theURL,winName,features) { //v2.0
window.open(theURL,winName,features);
}
//-->
</script>
有三个输入框, 前两个是输入数字的.第三个的内容是前两个的内容的和,第三个不能让人输入.也就是其它语言的 readonly 属性
<script>
function add(){
var a=parseInt(aa.value);
var b=parseInt(bb.value);
var c=a+b;
ye.value=c;
}
</script>
<input size=2 name=aa>+<input size=2 name=bb>=<input size=2 name=ye disabled> <input type=button value=add onclick=add()>
注册名字只能由中文或半角大小写字母或半角数字组成
注册名字只能由中文或半角大小写字母或半角数字组成
其他带有任何制表符号 例如"_",".",日文 空格 全角的都不通过
并且含有禁注册字符时会有对应的alert
<script language="JavaScript">
<!--
function JS_Test(str) {
if (str != '') {
if (str.match(/[^0-9a-zA-Z\u4E00-\u9FA5]/g,'')== null) { alert ("符合要求"); }
else { alert ("不符合要求"); }
}
}
//-->
</script>
<input name="txt">
<input type="button" value="判断注册是否合法" onClick="JS_Test(txt.value)">
只能输入数字正则
<input onKeyUp="value=value.replace(/\D+/g,'')">
只能输入中文正则
<input onKeyUp="value=value.replace(/[ -}]/g,'')">
隐去浏览器中当鼠标移到图片上跳出的工具栏
<img galleryimg="no">
或者
<head>
<meta http-equiv="imagetoolbar" content="no">
</head>
同一个页面多种超链接样式
<style>
a.c1{color=red}
a.c2{color=blue}
a.c3{color=orange}
</style>
<a href="/" class="c1">ahcuor1</a>
<a href="/" class="c2">ahcuor2</a>
<a href="/" class="c3">ahcuor3</a>
js动态给一个DIV插入一个表格
<div id="insertdiv">abc</div>
<script language="JavaScript">
<!--
insertdiv.innerText="";
var table1=document.createElement("<table border=1 width=500 bgcolor=black>");
table1.insertRow().insertCell().innerText="aaaaaaaaaaaaaaaa";
alert(table1.tagName);
document.getElementById("insertdiv").appendChild(table1);
//-->
</script>
让英文字符串超出表格宽度自动换行
word-wrap: break-word; word-break: break-all;
form问题
在一个form中只有一个input输入框的情况下...在这个input输入框中按enter的话,form就会被提交。如何避免这样的情况出现?
<form onsubmit="if(event.srcElement.name=='bb'){this.submit()}else{return false}">
<input name=a size=20>
<input type=button name=bb onclick="submit();">
</form>
CSS在文字下面加两横
<font style="border-bottom:4px double navy">huerreson</font>
<font style="border-bottom:1px solid navy;text-decoration:underline">huerreson</font>
<style>
.u2 { border-bottom:9px double navy;border-color:000000;text-decoration:underline;}
</style>
<span class='u2'>两横</span>
用回车提交表单
<body onLoad="form.txt.focus()">
<form name="form">
<input name="txt" size="100" value="Mouse点我提交,按Enter也提交" onClick="form.submit()" onKeyDown="if (event.keyCode==13)form.submit()">
</form>
让文字域里面的文字不可修改
禁用<input type="text" value="disabled" disabled>
不可修改<input type="text" value="readonly" readonly>
通过层来实现渐淡淡出
<script language="JavaScript1.2">
function makevisible(cur,which){
if (which==0)
cur.filters.alpha.opacity=100
else
cur.filters.alpha.opacity=50
}
</script>
<div style="width:200px;height:200px;filter:alpha(opacity=50);border:1px solid #000;background:#efefef" onMouseOver="makevisible(this,0)" onMouseOut="makevisible(this,1)">
ywicc.com
</div>
检查是否为首页
<HTML XMLNS:IE>
<HEAD>
<STYLE>
@media all {
IE\:HOMEPAGE {behavior:url(#default#homepage)}
}
</STYLE>
<SCRIPT>
function fnVerify(){
sQueryHome = oHomePage.isHomePage(oHomeHref.value);
alert(sQueryHome);
event.returnValue = false;
}
</SCRIPT>
</HEAD>
<BODY>
<IE:HOMEPAGE ID="oHomePage" />
<INPUT TYPE=text ID=oHomeHref VALUE="http://www.microsoft.com">
<INPUT TYPE=button VALUE="Verify" onclick="fnVerify()">
</BODY>
</HTML>
判断一个层是否被隐藏
判断一个层是否被隐藏?例如,如果某一个层是被隐藏的就弹出"你好"的新窗口
<div id="Layer1" style="position:absolute; width:200px; height:115px; z-index:1; display:none;">a</div>
<script language="JavaScript">
<!--
Layer1.style.display=="none"?alert("你好"):alert("hidden");
//-->
</script>
如何做网站中滚动的文字,还带超链接
<marquee direction=up scrollamount=2 onmouseover="this.stop();" onmouseout="this.start();" width=50>
<a href="http://www.chinaui.com">http://www.chinaui.com</a>
</marquee>
如何在javascript中使表单中的一个按钮无效
<form method=post action="" name="form1">
<input type="button" name="button1" value="51js.com">
</form>
<script language="JavaScript">
<!--
form1.button1.disabled=true;
//-->
</script>
刷新框架
我有一个框架网页,左右2个网页,现在我在主窗口(右页面)登陆后返回到主窗口页面,我如何让左边页面也能刷新呢?
<body onload="parent.leftFrame.location.reload();">
或者在页面的最后:
<script>
//leftFrame指左边框架的名字
parent.leftFrame.location.reload();
</script>
ID与name的区别
一个元素定义了id,引用该元素时直接用id属性,而name通常用在form中,且必须由document.form.***而来,也就是说,name属性定义的元素在脚本中是document对象的子对象。
我说不太清楚,反正这么个意思。
此外,ID标识在一个页面中原则上应该唯一,而name则不一定。
我要用文字做按扭提交表单,不用input,怎么做?
<form name="form1">
<a href="###" onclick="form1.submit()">提交</a>
</form>
图片reset表单
<form name=jie>
<input value="text">
<img src="http://be10.ods.org/51js/images/standard/report.gif"
onclick="document.jie.reset()"></form>
页面有多个CSS做个check box让用户选择
<HTML>
<HEAD>
<TITLE>换肤技术新的尝试</TITLE>
<link ID="skin" rel="stylesheet" type="text/css">
<SCRIPT LANGUAGE=javascript>
<!--
function SetCookie(name,value){
var argv=SetCookie.arguments;
var argc=SetCookie.arguments.length;
var expires=(2<argc)?argv[2]:null;
var path=(3<argc)?argv[3]:null;
var domain=(4<argc)?argv[4]:null;
var secure=(5<argc)?argv[5]:false;
document.cookie=name+"="+escape(value)+((expires==null)?"":("; expires="+expires.toGMTString()))+((path==null)?"":("; path="+path))+((domain==null)?"":("; domain="+domain))+((secure==true)?"; secure":"");
}
function GetCookie(Name) {
var search = Name + "=";
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search);
if (offset != -1) {
offset += search.length;
end = document.cookie.indexOf(";", offset);
if (end == -1)
end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset,end));
}
}
return returnvalue;
}
var thisskin;
thisskin=GetCookie("nowskin");
if(thisskin!="")
skin.href=thisskin;
else
skin.href="css.css";
function changecss(url){
if(url!=""){
skin.href=url;
var expdate=new Date();
expdate.setTime(expdate.getTime()+(24*60*60*1000*30));
//expdate=null;
//以下设置COOKIES时间为1年,自己随便设置该时间..
SetCookie("nowskin",url,expdate,"/",null,false);
}
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<P>请选择下面的下拉菜单测试换肤效果</P>
<select onchange="changecss(this.value)">
<option>选择样式单文件</option>
<script language="javascript">
var csss=new Array();
csss[0]="001.css";
csss[1]="002.css";
csss[2]="003.css";
csss[3]="004.css";
var i;
for(i=0;i<4;i++)
if(thisskin==csss[i])
document.write("<option value=\""+csss[i]+"\" selected>"+csss[i]+"样式单文件</option>");
else
document.write("<option value=\""+csss[i]+"\">"+csss[i]+"样式单文件</option>");
</script>
</select>
</BODY>
</HTML>
如何让iframe根据内容适应高度
请问如何让iframe根据内容适应高度
在第一次加载的时候就会自动根据内容适应高度
<iframe src="http://www.baidu.com" onload="this.height = this.document.body.offsetHeight;this.width=this.document.body.offsetWidth;"></iframe>