您的位置：首页 > Web前端 > JavaScript

一些javascript實用小功能

2005-07-14 22:36 267 查看
一些javascript實用小功能。使用率高達90%

使得一个页面暂停3秒钟后轉向另一個頁面

方法一：

以下内容为程序代码：
Response.Write("<br><a href='index.asp'>點擊回到主葉</a><br>或者等待3秒后自动返回你所指定的頁面<meta http-equiv='refresh' content='3;url=你所指定的頁面網址'><br>")
方法二：

以下内容为程序代码：
response.write ("<p align=center>3秒后自动返回你所指定的頁面<script>window.setTimeout(""location.href='你所指定的頁面網址''"",3000);</script></p>")
3秒后自動關閉窗口

以下内容为程序代码：
<script language="javascript">
function closeWidnow()
{
window.close();
}
</script>
</head>

<body onLoad="setTimeout(closeWidnow,3000)">
弹出新页面

以下内容为程序代码：
Response.Write("<Script>window.open('url')</script>");
返回上一页

以下内容为程序代码：
Response.Write("<script language='javascrip'>")
Response.Write("<a herf='javascript:history.go(-1);')>返回</a>")
Response.Write("</script>")
做一個loading過渡

以下内容为程序代码：
<script language="Javascript">

//eat the error, paste this code before any javascript start to load, you need this error handler.

window.onerror = doNothing

function doNothing() {return true}

</script>

<script language="Javascript">

//display the loading box, paste this code after </head>

document.writeln('<span id=loadingmsg style="border:1px ridge; Z-INDEX: 3; LEFT: 12; WIDTH: 131; POSITION: absolute; TOP: 18; HEIGHT: 50; BACKGROUND-COLOR: #FFFFFF"><CENTER><BR><font color="#808080"><FONT face=Arial size=3>Loading .....</FONT><BR></font></CENTER></span>')

</script>

<script language="Javascript">

// close the loading box, paste this at end of the document.

if (document.all) document.all.loadingmsg.style.visibility='hidden';

if (document.layers) document.loadingmsg.visibility='hidden'

if (document.getElementById) document.getElementById('loadingmsg').style.visibility='hidden'

</script>
///////////////////
以下内容为程序代码：
Response.Write("<div id='mydiv' >")
Response.Write("_")
Response.Write("</div>")
Response.Write("<script>mydiv.innerText = '';</script>")
Response.Write("<script language=javascript>;")
Response.Write("var dots = 0;var dotmax = 10;function ShowWait()")
Response.Write("{var output; output = '正在装载页面';dots++;if(dots>=dotmax)dots=1;")
Response.Write("for(var x = 0;x < dots;x++){output += '·';}mydiv.innerText = output;}")
Response.Write("function StartShowWait(){mydiv.style.visibility = 'visible'; ")
Response.Write("window.setInterval('ShowWait()',1000);}")
Response.Write("function HideWait(){mydiv.style.visibility='hidden';")
Response.Write("window.clearInterval();}")
Response.Write("StartShowWait();</script>")
Response.Flush()
Thread.Sleep(10000)

在aspx窗体的html的中输入：
<script>
HideWait();
</script>

怎样使按钮响应回车键

定在<head></head>之间

以下内容为程序代码：
<script language="javascript" event="onkeydown" for="document">
if(event.keyCode==13)
{
document.all('Button1').focus();
document.all('Button1').click();
}
</script>

################################或者

<form name="aa"></form>
<script>
function aa()
{
if(window.event.keycode==13)
aa.submit();
}

表格复选、复选变色、以及行的间隔行
用Hotmail的时候注意下，就是这个效果
以下内容为程序代码：
<style type="text/css">
<!--
.row {BACKGROUND-COLOR: expression(rowIndex%2==1?'':'#F5F5F5')}
Body {FONT-SIZE: 12px; FONT-FAMILY: Arial,Verdana,sans-serif;LINE-HEIGHT: 150%;}
Td {FONT-SIZE: 12px; FONT-FAMILY: Arial,Verdana,sans-serif;LINE-HEIGHT: 150%;}
.tb {border-collapse: collapse}
-->
</style>
<script language="JavaScript" type="text/JavaScript">
//复选
function selectAll(chk)
{
var chk = document.form1.chkAll.checked;
for (i=0;i<document.all.length;i++) {
if (document.all[i].name=="id[]") {
document.all[i].checked=chk;
chkRow(document.all[i]);
}}}

//复选后单元格变色
function chkRow(obj){
var r = obj.parentElement.parentElement;
if(obj.checked){ r.style.backgroundColor="#E6E9F2";}
else {if(r.rowIndex%2==1)r.style.backgroundColor="";else r.style.backgroundColor="#F5F5F5";}
}
</script>
<table width="50%" border="1" cellpadding="3" cellspacing="0" bordercolor="#333333" class="tb">
<form name="form1" method="post" action="">
<tr class="row">
<td width="5%"> </td>
<td width="33%" align="center"><strong>论坛名称</strong></td>
<td width="62%" align="center"><strong>网 址</strong></td>
</tr>
<tr class="row">
<td align="center"><input type="checkbox" name="id[]" value="1" onclick="javascript:chkRow(this);"></td>
<td align="center">织梦乱弹</td>
<td align="center"><a href="http://www.it365cn.com/bbs" target="_blank">http://www.it365cn.com/bbs</a></td>
</tr>
<tr class="row">
<td align="center"><input type="checkbox" name="id[]" value="1" onclick="javascript:chkRow(this);"></td>
<td align="center">经典论坛</td>
<td align="center"><a href="http://www.blueidea.com/bbs" target="_blank">http://www.blueidea.com/bbs</a></td>
</tr>
<tr class="row">
<td align="center"><input type="checkbox" name="id[]" value="1" onclick="javascript:chkRow(this);"></td>
<td align="center">点燃灵感</td>
<td align="center"><a href="http://www.fwcn.com/bbs" target="_blank">http://www.fwcn.com/bbs</a></td>
</tr>
<tr class="row">
<td colspan="3"><input type="checkbox" name="chkAll" title="全选/取消" onclick="selectAll()"> <strong>全选/取消</strong></td>
</tr>
</form>
</table>
限制表格的大小

style=" table-layout:fixed;word-break:break-all" '關鍵就是這句了
如果是只要限制td大小 可以

无论大图还是文字，一律限制。
以下内容为程序代码：
<table align=center width=200 height=100 bgcolor=#f3f3f3 style="filter:progid:DXImageTransform.Microsoft.Shadow(Color=#333333,Direction=120,strength=5)" style="table-layout:fixed;word-break:break-all" >
<tr>
<td><center><img src="http://www.cnbruce.com/images/cnrose/mi.jpg"></td>
</tr>
<tr>
<td>
cnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbrucecnbruce
</td></tr>
</table>
表格行换色

以下内容为程序代码：
<style>
#oTable tr {alternateColor:expression(bgColor=rowIndex%2==0?'#cccccc':'#efefef')}
</style>
<table width=500 height=100 border=1 ID="oTable">
<tr>
<td></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td></td>
</tr>
</table>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航