`
2277259257
  • 浏览: 515591 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

HTML提交表单

 
阅读更多

<form action="Handler1.ashx" method="post" > 

<p>客户名称: <input type="text" name="CustomerName" style="width: 300px" /></p> 

<p>客户电话: <input type="text" name="CustomerTel" style="width: 300px" /></p> 

<p><input type="submit" value="提交" /></p>

</form>

在这个HTML表单中,我定义了二个文本输入框,一个提交按钮,表单将提交到 Handler1.ashx中处理,且以POST的方式。 

注意哦,如果我们想让纯静态页面也能向服务器提交数据,就可以采用这样方式来处理:将action属性指向一个服务器能处理的地址

说明:当我们使用WebForms的服务器表单控件时,一般都会提交到页面自身来处理(action属性指向当前页面),这样可以方便地使用按钮事件以及从服务器控件访问从浏览器提交的控件输入结果。 

如果在URL重写时,希望能在页面回传时保持URL不变,即:action为重写后的URL,那么可以Page类中执行以下调用:

  Form.Action = Request.RawUrl;    // 受以下版本支持:3.5 SP1、3.0 SP1、2.0 SP1  

好了,我们再回到前面那个HTML表单,看一下如果用户点击了“提交”按钮,浏览器是如何把表单的内容发出的。在此,我们需要Fiddler工具的协助,请在提交表单前启动好Fiddler。我将这个表单的提交请求过程做了如下截图。

 

 上图是将要提交的表单的输入情况,下图是用Fiddler看到的浏览器发出的请求内容



 上图是将要提交的表单的输入情况,下图是用Fiddler看到的浏览器发出的请求内容。    在这张图片中,我们可以看到浏览器确实将请求发给了我前面在action中指定的地址,且以POST形式发出的。表单的二个控件的输入值放在请求体中,且做了【编码】处理,编码的方式用请求头【Content-Type】说明,这样,当服务端收到请求后,就知道该如何读取请求的内容了。注意:表单的数据是以name1=value1&name2=value2 的形式提交的,其中name,value分别对应了表单控件的相应属性。  

我们还可以在Fiddler中,将视图切换到WebForms选项卡,这样能更清楚地只查看浏览器提交的数据,如下图。

 

 

  • 大小: 53.5 KB
  • 大小: 60.8 KB
分享到:
评论

相关推荐

    html5表单提交按钮圆形进度条加载动画

    在“html5表单提交按钮圆形进度条加载动画”这个主题中,我们将深入探讨如何利用HTML5的表单特性,结合CSS和JavaScript来创建一个美观且具有交互性的圆形进度条加载按钮。 首先,HTML5的`&lt;form&gt;`元素提供了丰富的...

    html5简单大气的单选框表单提交代码下载

    html5简单大气的单选框表单提交代码下载 html5简单大气的单选框表单提交代码下载 html5简单大气的单选框表单提交代码下载 html5简单大气的单选框表单提交代码下载 html5简单大气的单选框表单提交代码下载

    提交表单生成html文件

    ### 提交表单生成HTML文件 #### 知识点概览 1. **HTML表单基本结构** 2. **表单提交方式与处理** 3. **JSP基础语法及使用** 4. **Java后台处理流程** 5. **文件操作:读写与创建** #### HTML表单基本结构 在给定...

    .net 后台提交表单并返回结果

    在.NET开发环境中,后台提交表单并返回结果是常见的网页交互模式,主要涉及HTML表单、HTTP请求以及服务器端的处理。在这个过程中,`a.aspx`页面作为客户端表单的发起者,通过POST或GET方法将数据提交到`b.aspx`页面...

    js实现定时提交表单

    在在线考试系统中,定时提交表单是一个关键功能,它确保考生在规定时间结束后自动提交试卷,防止作弊并保证考试公平性。下面将详细介绍如何使用JavaScript实现定时提交表单的功能。 首先,我们需要理解表单(Form)...

    js提交表单的三种方式

    在JavaScript中,提交表单是网页交互中的常见操作,它允许用户输入数据并将其发送到服务器进行处理。这里我们将详细探讨三种主要的表单提交方式:默认的HTML表单提交、JavaScript事件处理以及Ajax异步提交。 1. **...

    jq ajax提交表单

    完整的jq ajax提交表单,奖解压后jq文档加入页面中,调用就可惟了。 表单结构 &lt;form id="myForm" action="comment.php" method="post"&gt; Name: &lt;input type="text" name="name" /&gt; Comment: &lt;...

    ajax提交表单小例子

    本示例主要涉及如何使用AJAX来提交表单,并解决在提交中文数据时可能出现的乱码问题。 首先,我们了解AJAX的基本结构。一个基本的AJAX请求通常包括以下几个步骤: 1. 创建XMLHttpRequest对象:这是AJAX的核心,...

    利用ajax提交表单完整流程

    本文将详细介绍如何利用AJAX提交表单的完整流程,以实现更加流畅和用户友好的交互体验。 ### 1. 创建HTML表单 首先,我们需要创建一个HTML表单,它包含了用户输入的数据和一个用于触发AJAX提交的按钮。例如: ```...

    HTML5意见反馈提交表单页面模板.zip

    HTML5意见反馈提交表单页面模板是一个实用的网页设计资源,专为用户提供便捷的反馈提交功能。这个模板充分利用了HTML5的新特性,提升了用户体验并增强了表单处理能力。在这个模板中,用户可以方便地输入文本、上传...

    批量提交表单JS

    在网页开发中,批量提交表单是一个常见的需求,特别是在处理大量数据时,如上传文件、录入信息等。JS(JavaScript)作为客户端脚本语言,能够有效地实现这一功能。本资源包含了一个名为`jquery.form.js`的文件,它是...

    ajax提交表单到后台

    ### 一、前端:使用jQuery的AJAX提交表单 1. **引入jQuery库**:首先确保在HTML文件中引入了jQuery库。可以使用CDN链接或本地文件,例如: ```html &lt;script src="https://code.jquery.com/jquery-3.6.0.min.js"&gt;...

    js提交表单及js表单验证

    ### JS提交表单及JS表单验证 在Web开发中,JavaScript经常被用来增强用户体验,其中一个重要的应用领域就是表单验证。通过JavaScript进行前端验证,可以及时反馈用户输入错误,提高交互效率。本文将详细解释如何...

    JQuery表单提交和后台交互源码20130509

    仅使用jQuery提交表单和后台交互,不使用基于jQuery的表单插件 方式1、取到页面控件的值后拼接放在data中,传递到后台 方式2、页面序列化后放在data中,传递到后台 注:此种方式需设置页面控件的name属性

    post模拟登录,提交表单

    在IT行业中,模拟登录和提交...总结起来,模拟登录和提交表单是网络编程中的常见任务,涉及到HTTP请求、HTML解析、数据构造等多个环节。正确理解和运用这些技术,可以帮助我们高效地与Web应用交互,实现自动化流程。

    用iframe提交表单,主要是将表单提交到iframe中,可实现无刷新提交。

    用iframe提交表单,主要是将表单提交到iframe中,可实现无刷新提交。 html页面: &lt;iframe name="FORMSUBMIT" width="1" height="1" &gt;&lt;/iframe&gt; ...

    网页表单信息提交.html

    HTML表单信息提交

    javascript方式防止表单重复提交

    JavaScript作为客户端脚本语言,可以通过多种策略来防止用户意外或恶意地多次提交表单。以下是一些关键的知识点: 1. **禁用提交按钮**:最简单的预防方法是在用户点击提交按钮后立即将其禁用。这可以通过监听`...

    html文件上传后,处理类对上传文件的jar包处理

    html文件上传后,处理类对上传文件的jar包处理html文件上传后,处理类对上传文件的jar包处理html文件上传后,处理类对上传文件的jar包处理html文件上传后,处理类对上传文件的jar包处理html文件上传后,处理类对上传...

Global site tag (gtag.js) - Google Analytics