网页技巧学习:表单精确验证代码

技巧|网页

  在表单输入完数据以后,实现以下验证效果:

  1--规定输入的字小于50字

<script>
function test()
{
if(document.a.b.value.length>50)
  {
  alert("不能超过50个字符!");
  document.a.b.focus();
  return false;
  }
}
</script>
<form name=a >
<textarea name="b" cols="40" wrap="VIRTUAL"  rows="6"></textarea>
<input type="submit" name="Submit" value="check">

  2--只能是汉字

<input onkeyup="value=value.replace(/[^\u4E00-\u9FA5]/g,'')">

  3--只能是英文字符

<script language=javascript>
function onlyEng()
{
  if(!(event.keyCode>=65&&event.keyCode<=90))
    event.returnValue=false;
}
</script>
<input >

  4--只能是数字

<script language=javascript>
function onlyNum()
{
  if(!((event.keyCode>=48&&event.keyCode<=57)||(event.keyCode>=96&&event.keyCode<=105)))
//考虑小键盘上的数字键
    event.returnValue=false;
}
</script>
<input >

  5--只能是英文字符和数字

<input onkeyup="value=value.replace(/[\W]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))">

  6--规定的输入长度必须大于10字

<script>
function test()
{
if(document.a.b.value.length<10)
  {
  alert("不能少于10个字符!");
  document.a.b.focus();
  return false;
  }
}
</script>
<form name=a >
<textarea name="b" cols="40" wrap="VIRTUAL"  rows="6"></textarea>
<input type="submit" name="Submit" value="check">

  7--验证为email格式

<SCRIPT LANGUAGE=Javascript RUNAT=Server>
function isEmail(strEmail) {
 if (strEmail.search(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/) != -1)
  return true;
 else
  alert("oh");
}
</SCRIPT>
<input type=text onblur=isEmail(this.value)>

  8--屏蔽关键字(就是如果遇到我事先设置的关键字,就提示错误,无法继续)

<script language="JavaScript1.2">
function test() {
if((a.b.value.indexOf ("sex") == 0)||(a.b.value.indexOf ("****") == 0)){
    alert("五讲四美三热爱");
    a.b.focus();
    return false;}
}
</script>
<form name=a >
<input type=text name=b>
<input type="submit" name="Submit" value="check">
</form>

时间: 2024-08-01 17:49:59

网页技巧学习:表单精确验证代码的相关文章

javaScript技巧(2):表单提交验证类

javascript|表单提交|技巧 1 表单项不能为空 <script language="javascript"> <!-- function CheckForm() { if (document.form.name.value.length == 0) { alert("请输入您姓名!"); document.form.name.focus(); return false; } return true; } --> </scrip

js表单登陆验证示例_javascript技巧

本文实例讲述了js表单登陆验证的方法.分享给大家供大家参考,具体如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head>

js实现表单及时验证功能 用户信息立即验证_javascript技巧

问题:表单怎么在输入后立即验证,而不是提交后再验证那么不方便(网上搜到的要么是模棱两可,要么是残缺不全-) 方法:鉴于此,小可,水山奇,将其代码补全,加上小可我个人的理解(注释)在上面,仅供后来者少走弯路,也请各路好汉批评指正-(转发请注作者,xiexie)----table表格版,以后会继续有JQuery版- 如果帮助到您,顶一下 ヾ(≧O≦)"嗷~ 截图: 代码: <!DOCTYPE html> <html> <head> <meta http-eq

PHP入门教程之表单与验证实例详解_php技巧

本文实例讲述了PHP表单与验证.分享给大家供大家参考,具体如下: Demo1.php <?php ob_start(); //重新导向一个 URL //header() //header('Location:Demo2.php'); //上面这句话可以自动跳转到你所想要的页面. //header('Location:http://www.baidu.com'); //上面这句话自动跳转到百度上面去. echo 'baidu.com'; header('Location:http://www.ba

Javascript的表单与验证-非空验证_javascript技巧

推荐阅读:Javascript的表单验证长度 Javascript的表单验证-提交表单 Javascript的表单验证-初识正则表达式 Javascript的表单验证-揭开正则表达式的面纱  JavaScript 可用来在数据被送往服务器前对 HTML 表单中的这些输入数据进行验证. 表单提交前要检查数据的合法性 在要对表单里的数据进行验证的时候,可以利用getElementById()来访问网页上任何一个元素 每个表单域都有一个form对象,可被传给任何验证表单数据的函数 <input id=

jQuery+html5+css3实现圆角无刷新表单带输入验证功能代码_jquery

本文实例讲述了jQuery+html5+css3实现圆角无刷新表单带输入验证功能代码.分享给大家供大家参考.具体如下: 这里实现圆角表单,圆角输入框,无刷新验证,漂亮唯美,是对这款基于HTML5/CSS3/jQuery来实现的表单效果的简要概括,用HTML5可以实现很多超乎寻常的效果,从此你会喜欢上HTML5,会骂一下万恶的IE,到现在IE8还不支持HTML5,正悲哀着呢. 先来看看运行效果截图: 在线演示地址如下: http://demo.jb51.net/js/2015/jquery-htm

第七篇Bootstrap表单布局实例代码详解(三种表单布局)_javascript技巧

Bootstrap提供了三种表单布局:垂直表单,内联表单和水平表单.下面逐一给大家介绍,有兴趣的朋友一起学习吧. 创建垂直或基本表单: •·向父 <form> 元素添加 role="form". •·把标签和控件放在一个带有 class .form-group 的 <div> 中.这是获取最佳间距所必需的. •·向所有的文本元素 <input>.<textarea> 和 <select> 添加 class .form-cont

如何实现网页全屏显示,并不丢失表单数据,代码如下:

问题描述 <!--#includefile="inc/config.asp"--><!--#includefile="inc/conn.asp"--><!--#includefile="inc/class.asp"--><SCRIPTlanguage="JavaScript">functionFkey(){varWsShell=newActiveXObject('WScript.

Bootstrap表单布局样式代码_javascript技巧

废话不多说了,直接给大家贴代码了. <form class="form-horizontal" role="form"> <fieldset> <legend>配置数据源</legend> <div class="form-group"> <label class="col-sm-2 control-label" for="ds_host"&