熱點推薦:
您现在的位置: 電腦知識網 >> 編程 >> Java編程 >> JSP教程 >> 正文

網頁制作中表單相關特效整理

2022-06-13   來源: JSP教程 

  只能是一些限定的東西

  ENTER鍵可以讓光標移到下一個輸入框
<input onkeydown=if(eventkeyCode==)eventkeyCode= > <br>

  只能是中文<input onkeyup=value=valuereplace(/[ ~]/g) onkeydown=if(eventkeyCode==)eventkeyCode=> <br>

  屏蔽輸入法<input onkeydown=if(eventkeyCode==)eventkeyCode=> <br>

  只能輸入英文和數字<input onkeyup=value=valuereplace(/[\W]/g) onbeforepaste=clipboardDatasetData(textclipboardDatagetData(text)replace(/[^\d]/g)) onkeydown=if(eventkeyCode==)eventkeyCode=> <br>

  只能是數字<input onkeyup=value=valuereplace(/[^\d]/g) onbeforepaste=clipboardDatasetData(textclipboardDatagetData(text)replace(/[^\d]/g))><br>

  只能顯示不能修改<input readonly value=只能顯示不能修改>

  只能是數字判斷按鍵的值
<script  language=javascript>
function  onlyNum()
{
if(!((eventkeyCode>=&&eventkeyCode<=)||(eventkeyCode>=&&eventkeyCode<=)||(eventkeyCode==)))
eventreturnValue=false;
}
</script>
<input  onkeydown=onlyNum();

  附獲取鍵盤的KeyCode

  <html>
<head>
<script language=javascript>
  ns = (documentlayers) ? true : false;
  ie = (documentall) ? true : false;
function keyDown(e){
  if(ns){
  var nkey=ewhich;
  var iekey=現在是ns浏覽器;
  var realkey=StringfromCharCode(ewhich);
}
  if(ie){
  var iekey=eventkeyCode;
  var nkey=現在是ie浏覽器;
  var realkey=StringfromCharCode(eventkeyCode);
  if(eventkeyCode==){realkey=\ 空格\}
  if(eventkeyCode==){realkey=\ 回車\}
  if(eventkeyCode==){realkey=\ Esc\}
  if(eventkeyCode==){realkey=\ Shift\}
  if(eventkeyCode==){realkey=\ Ctrl\}
  if(eventkeyCode==){realkey=\ Alt\}
}
  alert(ns浏覽器中鍵值:+nkey+\n+ie浏覽器中鍵值:+iekey+\n+實際鍵為+realkey);
}
documentonkeydown = keyDown;
if(ns){
documentcaptureEvents(EventKEYDOWN);}
</script>
</head>
<body>
//Javascript Document
<hr>
<center>
<h>請按任意一個鍵</h>
</center>
</body>
</html>

  限制網頁用鍵盤

  <body onkeydown=alert(禁用);return false;>
限制鍵盤的某個鍵body onkeydown=if(eventkeyCode==num){alert(禁用);return false;}

  再加個找按鍵的值

  <script>
function show(){
  alert(ASCII代碼是+eventkeyCode);
}
</script>
<body onkeydown=show()>

  只能是IP地址

  <html>

  <head>
<meta httpequiv=ContentType content=text/html; charset=gb>
<meta name=GENERATOR content=Microsoft FrontPage >
<meta name=ProgId content=FrontPageEditorDocument>
<style>
a{width:;border:;textalign:center}
</style>
<script>
function mask(obj){
objvalue=objvaluereplace(/[^\d]/g)
key=eventkeyCode
if (key== || key==)
{ objblur();
nextip=parseInt(objnamesubstr())
nextip=key==?nextip:nextip+;
nextip=nextip>=?:nextip
nextip=nextip<=?:nextip
eval(ip+nextip+focus())
}
if(objvaluelength>=)
if(parseInt(objvalue)>= || parseInt(objvalue)<=)
{
alert(parseInt(objvalue)+IP地址錯誤!)
objvalue=
objfocus()
return false;
}
else
{ objblur();
nextip=parseInt(objnamesubstr())+
nextip=nextip>=?:nextip
nextip=nextip<=?:nextip
eval(ip+nextip+focus())
}
}
function mask_c(obj)
{
clipboardDatasetData(textclipboardDatagetData(text)replace(/[^\d]/g))
}

  </script>
<title>IP地址輸入</title>

  </head>
<body>IP地址輸入
<div >
<input type=text name=ip maxlength= class=a onkeyup=mask(this) onbeforepaste=mask_c()>
<input type=text name=ip maxlength= class=a onkeyup=mask(this) onbeforepaste=mask_c()>
<input type=text name=ip maxlength= class=a onkeyup=mask(this) onbeforepaste=mask_c()>
<input type=text name=ip maxlength= class=a onkeyup=mask(this) onbeforepaste=mask_c()>
</div>
</body>

  </html>

  用#default#savehistory防止後退清空text文本框

  <HTML>
<HEAD>
<META NAME=save CONTENT=history>
<STYLE>
  saveHistory {behavior:url(#default#savehistory);}
</STYLE>
</HEAD>
<BODY>
<INPUT class=saveHistory type=text id=oPersistInput>
<input type=button onclick=javascript:location點擊進入再按後退鍵試試?>
</BODY>
</HTML>

  TEXTAREA自適應文字行數的多少

  <textarea rows= name=s cols= onpropertychange=thisstyleposHeight=thisscrollHeight>

  上傳預覽圖片

  <img id=pic  src=_//gif>
<input type=file name=file><input type=button onclick=picsrc=filevalue value=預覽圖片>
<input type=button onclick=alert(filevalue) value=圖片地址>
<input type=button onclick=fileouterHTML=fileouterHTMLreplace(/value=\w/g) value=清除file裡字>


From:http://tw.wingwit.com/Article/program/Java/JSP/201311/19195.html
    推薦文章
    Copyright © 2005-2022 電腦知識網 Computer Knowledge   All rights reserved.