当前在线人数:
首页 | 新闻 | 旅游 | 房产 | 供求 | 商城 | 人才 | 相册 | 下载 | 出国 | 商旅 | 留学 | 劳务 | 创业 | 公司 | 考察 | 移民 | 其他
便民 | 分类 | 商家 | 交友 | 读经 | 华文 | 娱乐 | 汽车 | 两性 |  I T | 客服 | 沙龙 | 曲艺 | 投稿 | 书屋 | 留言 | 博客 | 论坛
您现在的位置: 新加坡第一华人门户网 >> 三味书屋 >> 电脑网络 >> 网络教程 >> 网页设计 >> 正文

表单(FORM)的一些实用代码

发布时间:2009-5-6 浏览人数: 作者:大森林 文章来源:本站原创 文字大小:【】【

限定只能是写限定的东西的代码

ENTER键可以让光标移到下一个输入框 : <input onkeydown="if(event.keyCode==13)event.keyCode=9" > <br>

只能是中文:<input onkeyup="value=value.replace(/[ -~]/g,'')" onkeydown="if(event.keyCode==13)event.keyCode=9"> <br>

只能是英文和数字.屏蔽了输入法:<input style="ime-mode:disabled" onkeydown="if(event.keyCode==13)event.keyCode=9"> <br>

只能输入英文和数字:<input onkeyup="value=value.replace(/[\W]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))" onkeydown="if(event.keyCode==13)event.keyCode=9"> <br>


只能是数字<input onkeyup="value=value.replace(/[^\d]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))"><br>


只能显示,不能修改的文本框<input readOnly value="只能显示,不能修改">


input中只能输入数字在提交时提示

<script  language=javascript>
function  onlyNum()
{
if(!((event.keyCode>=48&&event.keyCode<=57)||(event.keyCode>=96&&event.keyCode<=105)||(event.keyCode==8)))
event.returnValue=false;
}
</script>
<input  onkeydown="onlyNum();"> 


下拉列表打开窗口选择连接时弹出一个新窗口

<select  onChange="if(this.selectedIndex && this.selectedIndex!=0){window.open(this.value);}this.selectedIndex=0;">
<option selected>更多链接……</option>
<option value="http://www.cnbruce.com";>cnbruce</option>
<option value="http://daonet.myrice.com/old/";>daonet</option>
<option value="http://www.blueidea.com";>blue!dea
</select>


一个复选框,点击之后一组复选框全部都选上

<input type="checkbox" name="checkA" onpropertychange="for(i=0;i<A.children.length;i++){A.children.checked=this.checked}">a
<br>
<span id="A">
<input type="checkbox" name="A1">
<input type="checkbox" name="A2">
<input type="checkbox" name="A3">
</span>


select里的option进行分类列表

<span style="position:absolute;border:1px inset #d3d6d9"><select style="margin:-2px; width:200px">
<option selected>------------请选择------------</option>
<optgroup label="JavaScript&VBScript区">
 <option>原   创
 <option>经   典
<optgroup label="后台区">
 <option>asp&sql
 <option>php&mysql
</select></span>


提示限制输入的字符数

<script language="JavaScript">
<!--

function SymError()
{
  return true;
}

window.onerror = SymError;

function strlength(str){
    var l=str.length;
    var n=l
    for (var i=0;i<l;i++)
    {
        if (str.charCodeAt(i)<0||str.charCodeAt(i)>255) n++
    }
    return n       
}

function changebyte(value,length){
    var l=strlength(value)
    if (l<=length) {
        if (document.all!=null) document.all("byte").innerText="还可以输入"+(length-l)+"字节"
    }
    else
    {
        document.all("byte").innerText="输入字节数超出范围"
    }
    return true
}

function changebyte1(value,length){
    var l=strlength(value)
    if (l<=length) {
        if (document.all!=null) document.all("byte1").innerText="还可以输入"+(length-l)+"字节"
    }
    else
    {
        document.all("byte1").innerText="输入字节数超出范围"
    }
    return true
}

function changebyte2(value,length){
    var l=strlength(value)
    if (l<=length) {
        if (document.all!=null) document.all("byte2").innerText="还可以输入"+(length-l)+"字节"
    }
    else
    {
        document.all("byte2").innerText="输入字节数超出范围"
    }
    return true
}
</script>
<form method="post" name=test onSubmit="return checkdata()" action="">
<TEXTAREA onkeydown="return changebyte1(document.test.icqcontent.value,198)" onkeyup="return changebyte1(document.test.icqcontent.value,198)" name=icqcontent cols=40 rows="3"></TEXTAREA>
<SPAN id=byte1><SCRIPT language=JavaScript>changebyte1(document.test.icqcontent.value,198);</SCRIPT></SPAN>
</form>


判断填写字数的限制

<script language=javascript>
function gbcount(message,total,used,remain)
{
  var max;
  max = total.value;
  if(message.value.length > max){
    message.value = message.value.substring(0,max);
    used.value = max;
    remain.value = 0;
    alert('留言不能超过规定的字数!');
  }
  else{
    used.value = message.value.length;
    remain.value = max - used.value;
  }
}
</script>

<form name='myform' >
<textarea name='GuestContent' cols='59' rows='6'    onkeydown=gbcount(this.form.GuestContent,this.form.total,this.form.used,this.form.remain); onkeyup=gbcount(this.form.GuestContent,this.form.total,this.form.used,this.form.remain);></textarea>
最多字数:<INPUT disabled maxLength=4 name=total size=3 value=20>
已用字数:<INPUT disabled maxLength=4 name=used size=3 value=0>
剩余字数:<INPUT disabled maxLength=4 name=remain size=3>
</form>


注册阅读时间等待按钮

<form action="http://www.5dm.cn/bbs/"; method="post" name="agree">
欢迎注册自由视界论坛:
条款若干........

<input type="submit" value="请认真查看<服务条款和声明> (15)" name="agreeb">
</form>

<SCRIPT language=javascript>
<!--
var secs = 15;
document.agree.agreeb.disabled=true;
for(i=1;i<=secs;i++) {
 window.setTimeout("update(" + i + ")", i * 1000);
}
function update(num) {
 if(num == secs) {
 document.agree.agreeb.value =" 我 同 意 ";
 document.agree.agreeb.disabled=false;
 }
else {
 printnr = secs-num;
 document.agree.agreeb.value = "请认真查看<服务条款和声明> (" + printnr +")";
 }
}
//-->
</SCRIPT>

  • 上一篇文章:
  • 网友评论:(只显示最新10条。评论内容只代表网友观点,与本站立场无关!)
    数据载入中,请稍后……
    请遵守《互联网电子公告服务管理规定》及中华人民共和国其他各项有关法律法规。
    严禁发表危害国家安全、损害国家利益、破坏民族团结、破坏国家宗教政策、破坏社会稳定、侮辱、诽谤、教唆、淫秽等内容的评论 。
    用户需对自己在使用本站服务过程中的行为承担法律责任(直接或间接导致的),本站管理员有权保留或删除评论内容。

    推荐新闻更多>>>

  • 此栏目下没有推荐新闻
  • 新加坡风景更多>>>


    给我发消息 QQ咨询
    给我发消息 QQ咨询
    给我发消息 QQ咨询
    给我发消息 QQ咨询
    MSN
    E-mail