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 >

推荐阅读

post
使用Fetch进行HTTP请求的基本示例

本文介绍了如何使用JavaScript的Fetch API与Express服务器进行交互，涵盖了GET、POST、PUT和DELETE请求的实现，并展示了如何处理JSON响应。 ... [详细]

蜡笔小新 2024-12-22 12:55:37
ascii
实用正则表达式有哪些

小编给大家分享一下实用正则表达式有哪些，相信大部分人都还不怎么了解，因此分享这篇文章给大家参考一下，希望大家阅读完这篇文章后大有收获，下 ... [详细]

蜡笔小新 2024-12-22 13:59:04
input
MFC与ADO结合实现存储过程调用

本文介绍如何使用MFC和ADO技术调用SQL Server中的存储过程，以查询指定小区在特定时间段内的通话统计数据。通过用户界面选择小区ID、开始时间和结束时间，系统将计算并展示小时级的通话量、拥塞率及半速率通话比例。 ... [详细]

蜡笔小新 2024-12-22 14:22:36
ascii
字符串中特定字符的移除方法

本文介绍如何从字符串中移除大写、小写、特殊、数字和非数字字符，并提供了多种编程语言的实现示例。 ... [详细]

蜡笔小新 2024-12-22 00:08:06
ascii
深入理解JavaScript的作用域链与闭包

本文详细探讨了JavaScript中的作用域链和闭包机制，解释了它们的工作原理及其在实际编程中的应用。通过具体的代码示例，帮助读者更好地理解和掌握这些概念。 ... [详细]

蜡笔小新 2024-12-23 01:27:41
dll
Windows 7 64位系统下Redis的安装与PHP Redis扩展配置

本文详细介绍了在Windows 7 64位操作系统中安装Redis以及配置PHP Redis扩展的方法，包括下载、安装和基本使用步骤。适合对Redis和PHP集成感兴趣的开发人员参考。 ... [详细]

蜡笔小新 2024-12-22 23:56:09
dll
Hadoop发行版本选择指南：技术解析与应用实践

本文详细介绍了Hadoop的不同发行版本及其特点，帮助读者根据实际需求选择最合适的Hadoop版本。内容涵盖Apache Hadoop、Cloudera CDH等主流版本的特性及应用场景。 ... [详细]

蜡笔小新 2024-12-22 20:38:12
replace
采用IKE方式建立IPsec安全隧道

一、【组网和实验环境】按如上的接口ip先作配置，再作ipsec的相关配置，配置文本见文章最后本文实验采用的交换机是H3C模拟器，下载地址如 ... [详细]

蜡笔小新 2024-12-22 20:24:15
input
丽江客栈选择问题

本文介绍了一道经典的算法题，题目涉及在丽江河边的n家特色客栈中选择住宿方案。两位游客希望住在色调相同的两家客栈，并在晚上选择一家最低消费不超过p元的咖啡店小聚。我们将详细探讨如何计算满足条件的住宿方案总数。 ... [详细]

蜡笔小新 2024-12-22 20:15:25
config
深入理解 .NET 中的中间件

中间件是插入到应用程序请求处理管道中的组件，用于处理传入的HTTP请求和响应。它在ASP.NET Core中扮演着至关重要的角色，能够灵活地扩展和自定义应用程序的行为。 ... [详细]

蜡笔小新 2024-12-22 19:29:43
config
紫荆花之恋：动态树上的小精灵友谊问题

本题来自WC2014，题目编号为BZOJ3435、洛谷P3920和UOJ55。该问题描述了一棵不断生长的带权树及其节点上小精灵之间的友谊关系，要求实时计算每次新增节点后树上所有可能的朋友对数。 ... [详细]

蜡笔小新 2024-12-22 14:36:54
config
深入理解sed的G、H、g、h命令及其高级应用

本文详细介绍了流编辑器sed中的G、H、g、h命令，探讨了它们的工作原理及应用场景。通过实例解析和图解分析，帮助读者掌握这些高级命令的使用方法。 ... [详细]

蜡笔小新 2024-12-22 12:24:49
config
C51 中断处理机制中的 interrupt 和 using 关键字解析

本文详细介绍了8051系列微控制器的中断系统，特别是C51编译器中interrupt和using关键字的作用及其使用方法。通过深入分析这两个关键字的功能，帮助开发者更好地理解和优化中断程序的设计。 ... [详细]

蜡笔小新 2024-12-22 07:25:03
object
深入解析Java虚拟机（JVM）架构与原理

本文旨在为读者提供对Java虚拟机（JVM）的全面理解，涵盖其主要组成部分、工作原理及其在不同平台上的实现。通过详细探讨JVM的结构和内部机制，帮助开发者更好地掌握Java编程的核心技术。 ... [详细]

蜡笔小新 2024-12-21 23:50:40
object
性能分析：深入探讨进程中的线程行为

本文详细探讨了如何通过分析单个或多个线程在瓶颈情况下的表现，来了解处理器资源的消耗。无论是单进程还是多进程环境，监控关键指标如线程数量、占用时间及调度优先级等，有助于揭示潜在的性能问题。 ... [详细]

蜡笔小新 2024-12-21 20:47:03

手机用户2502853201

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

Tags | 热门标签

RankList | 热门文章