`
wdanping
  • 浏览: 23624 次
  • 性别: Icon_minigender_2
  • 来自: 上海
最近访客 更多访客>>
文章分类
社区版块
存档分类
最新评论

关于表单

阅读更多
实际用在HTML中的标签有form、 input、 textarea、 select和option。

表单标签form定义的表单里头,必须有行为属性action,它告诉表单当提交的时候将内容发往何处。

可选的方法属性method告诉表单数据将怎样发送,有get(默认的)和post两个值。常用到的是设置post值,它可以隐藏信息(get的信息会暴露在URL中)。

所以一个表单元素看起来是这样子的:

<form action="processingscript.htm" method="post"> </form>
input标签是表单世界中的“老大”。有10种形式,概括如下:

<input type="text" />是标准的文本框。它可以有一个值属性value,用来设置文本框里的默认文本。
<input type="password" /> 像文本框一样,但是会以星号代替用户所输入的实际字符。
<input type="checkbox" />是复选框,用户可以快速的选择或者不选一个条目。它可以有一个预选属性checked,像这样的格式<input type="checkbox" checked="checked" />.
<input type="radio" /> 与复选框相似,但是用户只可在一个组中选择一个单选按钮。它也有一个预选属性checked,使用方法跟复选框一样。
<input type="file" /> 是展示你电脑上的文件的一个区域,就像你在一个软件中打开或者保存一个文档一样。
<input type="submit" /> 是一个被点击后提交表单的按钮。你可以用值属性value来控制按钮上显示的文本(下面的button和reset类型也可以这样,稍后介绍),如下: <input type="submit" value="Ooo. Look. Text on a button. Wow" />.
<input type="image" />以图像代替按钮文本,src属性是必须的,像img标签一样。
<input type="button" />是一个如果没有其他代码的话什么都不做的按钮。
<input type="reset" /> 是一个点击后会重置表单内容的按钮。
<input type="hidden" /> 不会显示任何东西,它用来传输诸如用户正在用的页面的名字或者Email地址等表单必须传输的东西。
注意输入标签input也是用“/>”自关闭的。

多行文本输入框标签textarea基本上就是一个比较大的文本框。它必须有行属性rows和列属性cols,用法像这样:

<textarea rows="5" cols="20">A big load of text here</textarea>

选定标签select与选项标签option一起可以制作一个下拉选框。是这样工作的:

<select> <option value="first option">Option 1</option> <option value="second option">Option 2</option> <option value="third option">Option 3</option> </select>
当表单被提交时,被选中选项的值将被发送。

与复选框和单选按钮的预选属性checked一样,选项标签option也有一个预选属性selected,它可以用在这样的格式中:<option value="mouse" selected="selected">Rodent</option>。

上述的标签中在网页中看起来都不错,但是,如果你有一个程序来处理这个表单,这些标签都不起作用。这是因为,表单字段需要名称。所以所有的字段中都需要增加名称属性name,比如 <input type="text" name="talkingsponge" />。

一个表单看起来应该像下面这样(注意:这个表单不会工作,除非有一个用来提交数据的“contactus.htm”的文件,它位于表单标签form的行为属性action中。)


分享到:
评论

相关推荐

    JSP练习关于表单传递

    在这个“JSP练习关于表单传递”的例子中,我们将探讨如何通过JSP来接收和处理来自HTML表单的数据。** 在HTML表单中,用户可以输入数据并提交到服务器进行处理。表单通过`&lt;form&gt;`标签定义,其中`action`属性指定处理...

    关于表单提交的长度限制

    ### 关于表单提交的长度限制 在Web开发中,表单是用户与网站交互的重要方式之一。通过表单,用户可以向服务器提交数据,这些数据可以是用户名、密码、评论等任何类型的信息。然而,在实际应用中,为了提高用户体验...

    关于表单的Servlet708

    "关于表单的Servlet708"这个标题暗示我们将探讨如何使用Servlet处理用户通过表单提交的数据,这通常涉及到注册和登录功能。在这个场景下,开发者会创建一个Servlet来接收、处理并响应这些HTTP请求。 描述中提到的...

    关于表单的导出EXCEL设计,有时需要选择性的导出表单上的某些数据的解决方案

    在IT领域,尤其是在Web开发中,常常需要处理用户交互并提供数据导出功能,例如将表单数据导出为Excel格式。这样的需求通常出现在需要分析、存储或分享大量结构化数据时。本篇将深入探讨如何实现选择性地导出表单上的...

    关于表单自定义的方案设想

    在企业级应用中,表单自定义是一个重要的需求,尤其在工作流管理、信息收集和在线报名等场景。本文将探讨两种可能的表单自定义方案,以及相关的数据库表设计。 **方案一** 该方案首先设定表单模板定义,包括表单...

    关于表单自动计算月求和问题

    我在文本框中录入当日产量,则在另外文本框中,当月的产量和当年的产量自动算出,请问如何实现。

    漂亮的表单UI.rar

    【标题】"漂亮的表单UI.rar"所涉及的知识点主要集中在前端用户界面设计与实现上,尤其是关于表单的设计和交互。在Web开发中,表单是用户与应用程序交互的重要方式,用于收集、验证和提交数据。一个漂亮的表单UI不仅...

    angular4中关于表单的校验示例

    下面将详细介绍 Angular4 中关于表单的校验示例。 一、响应式表单 响应式表单是指使用 Angular 的 ReactiveFormsModule 来创建和管理表单。使用响应式表单可以轻松地创建和验证表单数据。下面是一个简单的响应式...

    E9流程表单前端接口API(V5).pdf

    关于表单操作事件校验接口,文档提到了表单提交、保存、退回、转发、强制收回等操作执行前,可以通过注册校验事件来判断是否允许执行操作。该接口支持的操作类型包括WfForm.OPER_SUBMIT、WfForm.OPER_SAVE、WfForm....

    表单常用20表单常用20表单常用20

    以下是一些关于表单设计的关键知识点: 1. **表单元素**:表单通常由多种元素组成,如文本输入框(text input)、密码输入框、选择框(checkbox)、下拉菜单(select)、单选按钮(radio button)和文件上传控件等...

    VFP综合查询表单程序

    然而,你遇到的问题是关于表单的最大化设置以及与背景图片和控件大小相关的视觉效果。 首先,让我们来讨论表单的最大化。在VFP中,当你设置一个表单为最大化时,它应该自动调整其大小以适应窗口。但你提到表单最大...

    常用表单数据验证JS

    以下是一些关于表单数据验证的基本概念和常用方法: 1. **基本概念**: - **数据验证**:是指在用户提交表单数据前,检查其是否满足特定条件,如长度、格式、范围等。 - **前端验证**:在客户端(用户浏览器)...

    Js 表单提交验证函数(很全了)

    1. `validity`对象:提供关于表单元素验证状态的信息,如`invalid`、`valueMissing`等。 2. `setCustomValidity(message)`:设置自定义的错误信息,显示在浏览器默认的提示中。 3. 自定义错误提示元素:可以创建额外...

    AmazeUI 表单

    对于"am表单"这个文件,很可能是AmazeUI中关于表单的示例代码或者组件库。这个文件可能包含了HTML结构、CSS样式和JavaScript代码,用于展示和演示AmazeUI的表单功能。开发者可以通过查看和运行这个文件,快速理解和...

    js带有登录提示验证的表单脚本代码

    总结,这个"js带有登录提示验证的表单脚本代码"项目涵盖了前端开发中关于表单设计、JavaScript验证、用户体验优化等多个方面的重要知识点。通过学习和应用这些技术,开发者可以创建出功能完善、用户体验良好的登录...

    漂亮 TP框架表单提交跳转页面

    标题中的“漂亮 TP框架表单提交跳转页面”指的是使用ThinkPHP(简称TP)框架进行Web开发时,关于表单提交后如何实现页面跳转的一个技术主题。在Web应用中,表单提交是用户与服务器交互的重要方式,而跳转页面则关乎...

    asp网页设计中有关表单的实例

    以上内容只是ASP网页设计中关于表单处理的基本介绍。实际上,表单还可以配合服务器端验证、JavaScript客户端验证、以及各种动态效果,实现更复杂的用户交互。在实际项目中,开发者需要根据需求灵活运用这些知识,...

    Struts2解决表单重复提交

    首先,关于表单重复提交的原因,有以下几点: 1. 服务器或网络延迟导致用户多次点击提交按钮。 2. 用户在表单提交后刷新浏览器页面。 对于第一种原因,即多次点击提交按钮导致的重复提交,Struts2框架提供了token...

    Form表单模拟美化插件.zip

    此外,通过分析源代码,我们可以学习到关于表单美化、JavaScript事件处理、CSS样式控制等多方面的Web开发技巧。 总的来说,"Form表单模拟美化插件"为开发者提供了一种方便快捷的方式来提升表单界面的视觉吸引力,...

Global site tag (gtag.js) - Google Analytics