javascript入门·表单与表单元素总结（表单验证）

作者：手机用户2502853201 | 来源：互联网 | 2023-10-15 18:44

表单提交前的最后验证：通常在表单提交前，我们必须确认用户是否都把必须填选的做了，如果没有，就不能被提交到服务器，这里我们用到表单的formname.submit()看演示，其实这个对于我们修炼道

表单提交前的最后验证：通常在表单提交前，我们必须确认用户是否都把必须填/选的做了，如果没有，就不能被提交到服务器，这里我们用到表单的 formname.submit() 看演示，其实这个对于我们修炼道教（错了，是.net）的人来说，有点多余，呵呵，毕竟微软的vs2003-2005都有非常棒棒棒的验证控件，如果有特别需要，自定义的验证也很不错哦，呵呵！！

演示一：这个也算对表单以及表单元素的一个综合演示了

用户名：
所在地区：
改变当前网页背景色	红黄绿

@LANGUAGE="Javascript" CODEPAGE="936" %>

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 >

< meta http-equiv ="Content-Type" content ="text/html; charset=gb2312" />

< title > 表单与表单元素总结（表单验证） title >

< script language ="Javascript" >

function yanzhen(form)

{//这里主要是验证看表单是否真要提交

var d=form.dx.options.selectedIndex;//得到二级地区被选择的索引

if(form.txt.value!="")

{//如果txt文本框不等于空

if(form.dx.options[d].value!=0)

{//如果二级地区值不为0

return true;//那么表单可以提交

}

return false;

}

function xiao(x)

{

//这个函数是地区菜单的代码，关于联动菜单的

//详细解释在http://www.cnblogs.com/thcjp/archive/2006/08/10/473054.html

var formm=document.form1;

var dalength=formm.da.options.length;

var group=new Array(dalength);

for(i=0;i<dalength;i++)

group[i]=new Array();

group[0][0]=new Option("请选择省","0")

group[1][0]=new Option("绵阳","绵阳")

group[1][1]=new Option("成都","成都")

group[1][2]=new Option("南充","南充")

group[2][0]=new Option("北京","北京")

group[3][0]=new Option("上海","上海")

var dx=formm.dx;

for(l=dx.options.length-1;l>0;l--)

{

dx.options[l]=null;

}

for(j=0;j<group[x].length;j++)

{

dx.options[j]=new Option(group[x][j].text,group[x][j].value)

}

dx.options[0].selected=true

}

function bgc(color)

{//从下面单选按钮传递的值来看，他已经把我们要的东西直接打包拿来了

document.bgColor=color//直接把背景赋值即可

}

script >

head >

< body >

< p > 表单提交前的最后验证：通常在表单提交前，我们必须确认用户是否都把必须填/选的做了，如果没有，就不能被提交到服务器，这里我们用到表单的 formname.submit() 看演示，其实这个对于我们修炼道教（错了，是.net）的人来说，有点多余，呵呵，毕竟微软的vs2003-2005都有非常棒棒棒的验证控件，如果有特别需要，自定义的验证也很不错哦，呵呵！！ p >

< p >< strong > 演示一：这个也算对表单以及表单元素的一个综合演示了 strong > p >

< form id ="form1" name ="form1" method ="get" onsubmit ="return yanzhen(this)" action ="http://thcjp.cnblogs.com" >

< table width ="600" border ="0" cellspacing ="0" cellpadding ="5" >

< tr >

< td width ="163" > 用户名： td >

< td width ="417" >< input name ="txt" type ="text" id ="txt" /> td >

tr >

< tr >

< td > 所在地区： td >

< td >< select name ="da" id ="da" onchange ="xiao(options.selectedIndex)" >

< option value ="0" > 请选择 option >

< option value ="1" > 四川 option >

< option value ="2" > 北京 option >

< option value ="3" > 上海 option >

select >

< select name ="dx" id ="dx" >

< option value ="0" > 请选择省 option >

select > td >

tr >

< tr >

< td > 改变当前网页背景色 td >

< td > 红

< input type ="radio" name ="se" value ="red" onchange ="bgc(this.value)" />

黄

< input type ="radio" name ="se" value ="yellow" onchange ="bgc(this.value)" />

绿

< input type ="radio" name ="se" value ="green" onchange ="bgc(this.value)" /> td >

tr >

< tr >

< td colspan ="2" align ="center" >< input type ="submit" value ="提交" /> td >

tr >

table >

form >

< p > p >

body >

html >

推荐阅读

input
如何使用JavaScript或jQuery检测文本框焦点状态和鼠标悬停事件

本文介绍了如何利用JavaScript或jQuery来判断网页中的文本框是否处于焦点状态，以及如何检测鼠标是否悬停在指定的HTML元素上。 ... [详细]

蜡笔小新 2024-12-27 21:33:33
js
深入理解Cookie与Session会话管理

本文详细介绍了如何通过HTTP响应和请求处理浏览器的Cookie信息，以及如何创建、设置和管理Cookie。同时探讨了会话跟踪技术中的Session机制，解释其原理及应用场景。 ... [详细]

蜡笔小新 2024-12-27 18:20:43
heap
优化ListView性能

本文深入探讨了如何通过多种技术手段优化ListView的性能，包括视图复用、ViewHolder模式、分批加载数据、图片优化及内存管理等。这些方法能够显著提升应用的响应速度和用户体验。 ... [详细]

蜡笔小新 2024-12-28 10:36:30
input
技术分享：从动态网站提取站点密钥的解决方案

本文探讨了如何从动态网站中提取站点密钥，特别是针对验证码（reCAPTCHA）的处理方法。通过结合Selenium和requests库，提供了详细的代码示例和优化建议。 ... [详细]

蜡笔小新 2024-12-28 04:11:47
object
新浪笔试题

1:有如下一段程序：packagea.b.c;publicclassTest{privatestaticinti0;publicintgetNext(){return ... [详细]

蜡笔小新 2024-12-27 19:32:17
random
Java并发编程：LinkedBlockingQueue的实际应用

本文介绍了Java并发库中的阻塞队列（BlockingQueue）及其典型应用场景。通过具体实例，展示了如何利用LinkedBlockingQueue实现线程间高效、安全的数据传递，并结合线程池和原子类优化性能。 ... [详细]

蜡笔小新 2024-12-27 18:51:49
input
JQuery基础：省市联动与表单验证

本文介绍了如何使用JQuery实现省市二级联动和表单验证。首先，通过change事件监听用户选择的省份，并动态加载对应的城市列表。其次，详细讲解了使用Validation插件进行表单验证的方法，包括内置规则、自定义规则及实时验证功能。 ... [详细]

蜡笔小新 2024-12-27 17:10:48
int
Docker的安全基准

nsitionalENhttp:www.w3.orgTRxhtml1DTDxhtml1-transitional.dtd ... [详细]

蜡笔小新 2024-12-28 13:00:24
input
PHP 编程疑难解析与知识点汇总

本文详细解答了 PHP 编程中的常见问题，并提供了丰富的代码示例和解决方案，帮助开发者更好地理解和应用 PHP 知识。 ... [详细]

蜡笔小新 2024-12-28 12:22:34
int
Android 模拟用户交互：点击与滑动操作的实现

本文介绍如何在 Android 中通过代码模拟用户的点击和滑动操作，包括参数说明、事件生成及处理逻辑。详细解析了视图（View）对象、坐标偏移量以及不同类型的滑动方式。 ... [详细]

蜡笔小新 2024-12-28 12:12:22
js
解决Uploadify在IE浏览器中的兼容性问题

本文详细介绍了如何解决Uploadify插件在Internet Explorer（IE）9和10版本中遇到的点击失效及JQuery运行时错误问题。通过修改相关JavaScript代码，确保上传功能在不同浏览器环境中的一致性和稳定性。 ... [详细]

蜡笔小新 2024-12-27 22:07:40
default
java编写的简易计算器

主要用了2个类来实现的，话不多说，直接看运行结果，然后在奉上源代码1.Index.javaimportjava.awt.Color;im ... [详细]

蜡笔小新 2024-12-27 18:18:10
int
深入理解 SQL 视图、存储过程与事务

本文详细介绍了SQL中的视图、存储过程和事务的概念及应用。视图为用户提供了一种灵活的数据查询方式，存储过程则封装了复杂的SQL逻辑，而事务确保了数据库操作的完整性和一致性。 ... [详细]

蜡笔小新 2024-12-27 17:40:42
default
深入解析ExpandableComposite.addExpansionListener()方法及其应用

本文详细介绍了Java中org.eclipse.ui.forms.widgets.ExpandableComposite类的addExpansionListener()方法，并提供了多个实际代码示例，帮助开发者更好地理解和使用该方法。这些示例来源于多个知名开源项目，具有很高的参考价值。 ... [详细]

蜡笔小新 2024-12-27 16:11:49
object
深入解析Spring Cloud Ribbon负载均衡机制

本文详细介绍了Spring Cloud中的Ribbon组件如何实现服务调用的负载均衡。通过分析其工作原理、源码结构及配置方式，帮助读者理解Ribbon在分布式系统中的重要作用。 ... [详细]

蜡笔小新 2024-12-27 16:01:25

手机用户2502853201

这个家伙很懒，什么也没留下！

Tags | 热门标签

RankList | 热门文章