1、單行省略號
<DIV STYLE="width: 120px; height: 50px; border: 1px solid blue;
overflow: hidden; text-overflow:ellipsis">
<NOBR>就是比如有一行文字,很長,表格內一行顯示不下.</NOBR>
</DIV>
2、動態文本選擇
<html>
<head>
<title>動態列表框</title>
</head>
<body οnlοad="init()">
<select id="chgSelect" size="5" style="display:none" οnclick="edit.value=value">
<option value="csdn">csdn
<option value="msdn">msdn
<option value="net_lover">net_lover
<option value="meizz">meizz
<option value="wsj">wsj
<option value="emu">emu
</select>
<input οnkeyup="editselect(this)" id="edit"><input type=button value='refresh' οnclick='init(0)'>
<script>
var sv=new Array()
function init(n){
var s=document.getElementById("chgSelect")
var ev=document.getElementById("edit")
if(n!=0){
for(i=0;i<s.options.length;i++){
sv.push(s.options[i].value)
}
s.display='none'
return;
}
ev.value=""
s.options.length=0
for(i=0;i<sv.length;i++){
s.add(new Option(sv[i],sv[i]))
}
}
function editselect(obj){
var sValue=obj.value
var s=document.getElementById("chgSelect")
s.options.length=0
for(i=0;i<sv.length;i++){
if(sv[i].indexOf(sValue)>=0){
s.style.display=''
s.add(new Option(sv[i],sv[i]))
}
}
}
</script>
</body>
</html>
3、驗證
有關日期手工輸入驗證、日期彈出框、數值輸入驗證、必須輸入驗證等(共三個文件)
頁面文件:inputCheck.htm
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>普通輸入驗證示例</title>
<script language="Javascript" src="commonForManage.js"></script>
</head>
<body>
<form name=frm οnsubmit="return checkNecessaryInput(this);" method=post >
<table align=center style="border: 1 solid #000000">
<tr><td>數值1<font color=red>*</font><input name=a alt="數值1" οnblur="checkDecimalInput(this)" ></td>
<td>數值2:<input name=b οnblur="checkDecimalInput(this,-1,1)" ><font size=-3>(大於-1,小於1)</font></td>
<td>數值3:<input name=b οnblur="checkDecimalInput(this,-0.0000001,1.0000001)" ><font size=-3>(大於或等於0,小於蔌等於1)</font></td>
</tr>
<tr><td>整數1<font color=red>*</font><input name=a alt="整數1" οnblur="checkIntInput(this)" ></td>
<td>整數2:<input name=b οnblur="checkIntInput(this,-100,100)" ><font size=-3>(大於-100,小於100)</font></td>
<td>整數3:<font size=-3><input name=b οnblur="checkIntInput(this,-0.0000001,100.0000001)" ></td>
(大於或等於0,小於或?/font>扔?00)</tr>
<tr><td>日期1<font color=red>*</font><input name=a alt="日期1" οnblur="checkDateInput(this)" οndblclick="getDateFromDialog(this);"></td>
<td>日期2:<input name=b οnblur="checkDateInput(this)" οndblclick="getDateFromDialog(this);"></td>
<td>注:雙擊輸入框可以彈出日曆</td>
</tr>
<tr><td>編號1<font color=red>*</font><input name=a alt="編號1" οnblur="checkNoInput(this)" ></td>
<td>編號2:<input name=b οnblur="checkNoInput(this)" ></td>
<td>注:編號裏只能有<font color=blue>數字</font>、<font color=blue>字母</font>、<font color=blue>-</font>、<font color=blue>_</font>、<font color=blue>.</font></td>
</tr>
<tr><td>輸入1<font color=red>*</font><input name=a alt="輸入1" ></td>
<td>輸入2:<input name=b value=2 ></td>
<td>不限制輸入內容</td>
</tr>
<tr><td>選擇1<font color=red>*</font><select name=c alt="選擇1">
<option value="">請選擇</option>
<option value="1">一</option>
<option value="2">二</option>
<option value="3">三</option>
<option value="4">四</option>
<option value="5">五</option>
</select></td>
<td>選擇2:<select name=d >
<option value="">請選擇</option>
<option value="1">一</option>
<option value="2">二</option>
<option value="3">三</option>
<option value="4">四</option>
<option value="5">五</option>
</select></td>
<td> </td>
</tr>
<tr><td>複選<input type=checkbox name=e value=5 ><input type=checkbox name=e value=2 ><input type=checkbox name=e value=3 ></td>
<td>單選<input type="radio" value="1" checked name="f"><input type="radio" value="2" checked name="f"><input type="radio" value="3" checked name="f"></td>
<td> </td>
</tr>
<tr><td colspan=2>
<input type=button value=確定 οnclick="javascript:if (checkNecessaryInput(frm)) frm.submit();">
<input type=button value=清空 οnclick="javascript:resetProcess(frm);">
</td></tr>
<tr><td colspan=3>
<pre>
說明:
1.由於當輸入錯誤時,blur事件檢查到有錯誤時使用了focus方法,故所有的輸入框的預
設值(包括所有的非手工輸入的值)必須正確,否則有可能發生搶焦點的死循環
2.必須輸入的驗證使用了遍歷,請反對遍歷的朋友包涵
3.歡迎各位指點
</pre>
</td></tr>
</table>
</form>
</body>
</html>
////////////////////////////////////////////////////////
輸入檢查文件:commonForManage.js
function checkNecessaryInput(obj) //用於檢查一個表單內所有必須輸入的欄位是否輸入完整
{
var s="";
var i;
var j=0;
for (i=0 ;(i<obj.elements.length)&&(j<10);i++)
{
if (( obj.elements[i].alt != null ) && (obj.elements[i].alt.length>0) && (obj.elements[i].value!=null) && (obj.elements[i].value.length==0) )
{
s+="/n"+obj.elements[i].alt; //遍歷所有輸入,如果必須輸入且沒有輸入值,就將其內容加到警告信息中去
j=j+1;
}
}
if (j > 0 )
{
alert ("以下資料必須輸入"+s);
return false;
}
return true;
}
function checkDecimalInput(obj,min,max) //作用是將輸入變成Number(10,6)格式,默認範圍是非負。
{
obj.value=obj.value.replace(/ /g,""); //去空格
if (obj.value=="") return false;
if (obj.value.substr(0,1)==".") obj.value="0"+obj.value;
if (obj.value.substr(0,2)=="-.") obj.value=obj.value.replace("-.","-0.");
var r, re;
var s = obj.value ;
var theMin=-0.0000001;
var theMax=10000000000;
if (min!=null) theMin=min;
if (max!=null) theMax=max;
if (s.length==0) return false;
re = /-{0,1}/d{1,10}/.{0,1}/d{0,6}/i;
r = s.match(re); //取數
if (r==null)
{
obj.value="";
alert("!!!!請注意:/n您剛纔輸入的數值不正確,我們已進行了清除。");
obj.focus();
return false;
}
if ((r>=theMax)||(r<=theMin))
{
obj.value="";
alert("!!!!請注意:/n您剛纔輸入的數值超出允許範圍,我們已進行了清除。");
obj.focus();
return false;
}
if ( r!=s)
{
obj.value=r;
alert("!!!!請注意:/n您剛纔輸入的數值不正確,我們已進行了修改。");
obj.select();
obj.focus();
return false;
}
obj.value=r;
}
function checkIntInput(obj,min,max) //作用是將輸入變成整數,默認範圍是非負。onblur event
{
obj.value=obj.value.replace(/ /g,""); //去空格
if(obj.value=="") return false;
var r;
var s = obj.value ;
var theMin=-1;
var theMax=10000000000;
if (min!=null) theMin=min;
if (max!=null) theMax=max;
if (s.length==0) return false;
r = parseInt(s);; //取數
if (r==null||isNaN(r))
{
obj.value="";
alert("!!!!請注意:/n您剛纔輸入的整數不正確,我們已進行了清除。");
obj.focus();
return false;
}
if ((r>=theMax)||(r<=theMin))
{
obj.value="";
alert("!!!!請注意:/n您剛纔輸入的整數超出允許範圍,我們已進行了清除。");
obj.focus();
return false;
}
if ( r!=s)
{
obj.value=r;
alert("!!!!請注意:/n您剛纔輸入的整數不正確,我們已進行了修改。");
obj.select();
obj.focus();
return false;
}
obj.value=r;
}
function checkDateInput(obj) //用於檢查日期輸入是否正確 (日期輸入範圍爲1930-01-01 到2200-12-31)
{
if (obj.value.length==0) return false;
var objValue=obj.value.replace(/[-/.]/g,"/");
try
{
var a=new Date(objValue);
if (isNaN(a))
{
obj.value="";
alert("!!!!請注意:/n您剛纔輸入的日期不正確,我們已進處了清除。");
obj.focus();
return false;
}
var b;
if (a.getFullYear()<1900||a.getFullYear()>2200)
{var Today=new Date();
b=Today.getFullYear()+"-"+(a.getMonth()+1)+"-"+a.getDate();
}
else if (a.getFullYear()<1930)
b=(a.getFullYear()+100)+"-"+(a.getMonth()+1)+"-"+a.getDate();
else b=a.getFullYear()+"-"+(a.getMonth()+1)+"-"+a.getDate();
obj.value=obj.value.replace(/[-/.//]0*/g,"-");
if (b!=obj.value)
{
obj.value=b;
alert("!!!!請注意:/n您剛纔輸入的日期不正確,我們已進行了修改。");
obj.select();
obj.focus();
return false;
}
}
catch(Exception)
{
obj.value="";
alert("!!!!請注意:/n您剛纔輸入的日期不正確,我們已進處了清除。");
obj.focus();
return false;
}
return true;
}
function getDateFromDialog(obj) //利用彈出輸入日期
{
checkDateInput(obj);
var a=showModalDialog("calendar.htm",obj.value.replace(/[-/.]/g,"//"),"status:no;resizable:no;help:no;dialogHeight:220px;dialogWidth:319px;DialogLeft:"+event.screenX+";DialogTop:"+event.screenY);
if (a!=null) obj.value=a;
}
function checkNoInput(obj) //用於檢查編號輸入是否正確。編號由字母、數字、_、-組成
{
if (obj.value.length==0) return false;
var objValue=obj.value.replace(/ /g,"/");
var a=/[/w-/.]{1,30}/i;
var b=objValue.match(a);
if (b==null)
{
obj.value="";
alert("!!!!請注意:/n您剛纔輸入的編號不正確,我們已進行了清除。");
obj.focus();
return false;
}
if ( b!=objValue )
{
obj.value=b;
alert("!!!!請注意:/n您剛纔輸入的編號不正確,我們已進行了修改。");
obj.select();
obj.focus();
return false;
}
}
function checkMonthInput(obj) // 20020815 用於檢查糾正yyyymm形式的月份輸入
{
obj.value=obj.value.replace(/ /g,"");
if (obj.value.length==0) return false;
var a=/((19)|(20))/d/d[0,1]{0,1}/d/i;
var b;
var c;
if (!(a.test(obj.value)))
{
obj.value="";
alert("!!!!請注意:/n您剛纔輸入的月份不正確,我們已進行了清除。");
obj.focus();
return false;
}
else
{
b=obj.value.match(a)[0];
b=b.substring(0,4)+"/"+b.substring(4,6)+"/1";
c=new Date(b);
b=c.getFullYear()+""+(c.getMonth()+1);
if (b.length<6)
b=c.getFullYear()+"0"+(c.getMonth()+1);
if (b!=obj.value)
{
obj.value=b;
alert("!!!!請注意:/n您剛纔輸入的月份不正確,我們已進行了修改。");
return false;
}
}
}
function resetProcess(obj) // 20020619 用於將指定obj內的所有text-input與select的值清空
{
var a;
if (obj==null) a=document.all("theQueryConditionTable");
else a=obj;
if (a==null) return false;
var b=a.getElementsByTagName("INPUT");
for (var i=0;i<b.length;i++)
{
if (b[i].type=="text") b[i].value="";
}
b=a.getElementsByTagName("SELECT");
for (var i=0;i<b.length;i++)
{
b[i].options[0].selected=true;
}
}
function roundFun(numberRound,roundDigit) //四捨五入,保留位數爲roundDigit ,供計算時用
{
if (numberRound>=0)
{
var tempNumber = parseInt((numberRound * Math.pow(10,roundDigit)+0.5))/Math.pow(10,roundDigit);
return tempNumber;
}
else
{
numberRound1=-numberRound
var tempNumber = parseInt((numberRound1 * Math.pow(10,roundDigit)+0.5))/Math.pow(10,roundDigit);
return -tempNumber;
}
}
/////////////////////////////////////////////////////////
日曆文件:calendar.htm
<html>
<head>
<title>日曆</title>
<style>
TD{
font-size:9pt;
}
</style>
</head>
<body><table align=center><tr><td width=80%>
<script language=javascript>
document.write("<select name=yearInput οnchange='showCalendar()'>");
for (var i=1930;i<2200;i++) document.write("<option value='"+i+"'>"+i+"</option>");
document.write("</select>年<select name=monthInput οnchange='showCalendar()'>");
for (var i=1;i<13;i++) document.write("<option value='"+i+"'>"+i+"</option>");
document.write("</select>月");
document.write("</td><td align=right><input type=button value=今天 οnclick='returnToday();'>");
</script>
</td></tr></table>
<div id="theCalendar" align=center width=100% >
</div>
</body>
</html>
<script language="javascript">
function showCalendar() //日曆顯示
{
var theCalendarContent="";
var b=new Date(yearInput.value+"//"+monthInput.value+"//"+1);
var c=new Date(yearInput.value+"//"+(monthInput.value*1+1)+"//"+0);
var theMonthDays=c.getDate();
var i=0;
var j=b.getDay();
var k=1;
theCalendarContent+="<table οndblclick='getTD(event.srcElement)' border=1 style='border: solid 1 #5661a8; font-Size: 9pt; font-family: Arial; background: #e0e3f7' width=100% align=center><tr bordercolorlight='#5661a8' bordercolordark='#5661a8' style='background: #5661a8; color: #ffffff'><td >週日</td><td>週一</td><td>週二</td><td>週三</td><td>週四</td><td>週五</td><td>週六</td></tr><tr>";
for (j=0;j<b.getDay();j++) theCalendarContent+="<td> </td>";
for (i=0;(i<6)&&(k<theMonthDays+1);i++)
{
for (j;j<7;j++)
{
if (k<theMonthDays+1)
{
if (j<6&&j>0) theCalendarContent+="<td bordercolorlight='#5661a8' align='center' style='color:#ff0000'>"+(k++)+"</td>";
else theCalendarContent+="<td bordercolorlight='#5661a8' align='center'>"+(k++)+"</td>";
}
else theCalendarContent+="<td> </td>";
}
theCalendarContent+="</tr><tr >";
j=0;
}
theCalendarContent+="</tr></table>";
theCalendar.innerHTML=theCalendarContent;
}
function getTD(obj) //返回選中日期
{
if (obj.tagName!="TD") return false;
if (isNaN(obj.innerText)||(obj.innerText==0)) return false;
var a=yearInput.value+"-"+monthInput.value+"-"+obj.innerText;
window.returnValue=a;
window.close();
}
function returnToday() //返回本日
{
var todaydate=new Date();
var a=todaydate.getFullYear()+"-"+(todaydate.getMonth()+1)+"-"+todaydate.getDate();
window.returnValue=a;
window.close();
}
function initCalendar() //初始化日曆
{
var a=window.dialogArguments;
var b=new Date();
if ((a!=null)&&(a.length>4)) b=new Date(a);
if (isNaN(b)) b=new Date();
yearInput.value=b.getFullYear();
monthInput.value=(b.getMonth()+1);
showCalendar();
}
initCalendar();
</script>
4、瑣碎
public static string MD5(string pwd)
{
return System.Web.Security.FormsAuthentication.HashPasswordForStoringInConfigFile(pwd, "MD5");
}
/////////////////////////////////
<a href="#" onClick="javascript:window.open('notice/show.asp?id=1627','公告欄目','scrollbars=yes,resizable=yes,width=500,height=400')"> IP封鎖公告</a>
///////////////////////////
<script>
setTimeout("self.close()",10000) //毫秒
</script>
////////////////////////
<asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl='<%# "~/detailnews.aspx"+ Eval("NewsTitle") %>' Text='<%# Eval("NewsTitle") %>'></asp:HyperLink>
5、聲音
爲你的aspx的head段中加入:
<bgsound runat=server id=mySound border="0">
代碼中首先聲明控件:
protected HtmlGenericControl mySound;
頁面需要播放聲音,就運行:
mySound.Attribute.Add("src","/Expert/Deeptree/newMessage.wav");
可見,聲音文件可以由後臺選擇。
///////////////////////////////////////////////////
bgsound好像只有IE支持,其它瀏覽器好像不支持。
也可以用<EMBED SRC=″你要加的音樂文件.wav″WIDTH=145 HEIGHT=60>
〈EMBED〉標記語法說明:
SRC=“文件名稱和路徑”:設置背景音樂的路徑和名稱;
AUTOSTART=“TRUE/FALSE”:設置是否音樂文件一傳完後就開始播放,默認爲FALSE(否)
LOOP=“ TRUE/FALSE/整數”:設置重播次數,TRUE爲無限次重播,FALSE爲不重播,LOOP=某個整數,爲重播多少次。
VOLUME=“0-100”:設置音量,默認爲系統本身的音量;
STARTTIME=“分:秒”:設置歌曲開始播放的時間,如STARTTIME=“00:20”爲從第20秒開始播放;
ENDTIME=“分:秒”:設置歌曲播放結束的時間 ;
WIDTH和HIGH=“整數”:設置控制面板的寬和高;
//////////////////////////////////////////////////////
<EMBED src='/Upload/nocturne.mp3' type=audio/x-pn-realaudio-plugin autostart='true' loop='true' hidden='true'></EMBED>
6、表格創建
private void MakeDataTableAndDisplay()
{
// Create new DataTable and DataSource objects.
DataTable table = new DataTable();
// Declare DataColumn and DataRow variables.
DataColumn column;
DataRow row;
DataView view;
// Create new DataColumn, set DataType, ColumnName and add to DataTable.
column = new DataColumn();
column.DataType = System.Type.GetType("System.Int32");
column.ColumnName = "id";
table.Columns.Add(column);
// Create second column.
column = new DataColumn();
column.DataType = Type.GetType("System.String");
column.ColumnName = "item";
table.Columns.Add(column);
// Create new DataRow objects and add to DataTable.
for(int i = 0; i < 10; i++)
{
row = table.NewRow();
row["id"] = i;
row["item"] = "item " + i.ToString();
table.Rows.Add(row);
}
// Create a DataView using the DataTable.
view = new DataView(table);
// Set a DataGrid control's DataSource to the DataView.
dataGrid1.DataSource = view;
}
7、日期驗證
if(month<1||month>12) {
alert("月份必須在01和12之間!");
checktext.focus();
return false;
}
if(day<1||day>31){
alert("日期必須在01和31之間!");
checktext.focus();
return false;
}else{
if(month==2){
if(isLeapYear(year)&&day>29){
alert("二月份日期必須在01到29之間!");
checktext.focus();
return false;
}
if(!isLeapYear(year)&&day>28){
alert("二月份日期必須在01到28之間!");
checktext.focus();
return false;
}
}
if((month==4||month==6||month==9||month==11)&&(day>30)){
alert("在四,六,九,十一月份 /n日期必須在01到30之間!");
checktext.focus();
return false;
}
}
7、論壇源碼下載