本篇文章主要的介绍了关于HTML中form标签action属性的用法介绍和实例,还有关于form标签的action属性的定义和语法介绍,最后徐还有关于form标签的action属性的作用解释。现在让我们一起来看吧。

我们先来介绍HTML中form标签的action属性的含义:

action属性规定当提交表单时,向何处发送表单数据。(是必需的属性)

属性值的介绍:(看图)

熟悉了action属性的含义和语法,现在让我们来看看实例:

下面的表单是拥有两个输入字段以及一个提交按钮,当提交表单时,表单数据会提交到名为 "form_action.asp" 的页面:

<form action="form_action.asp" method="get"><p>这里输名字: <input type="text" name="fname" /></p><p>接着输名字: <input type="text" name="lname" /></p><input type="submit" value="Submit" /></form>

效果图:(又看图)

表单的动作属性(Action)和确认按钮

当用户单击确认按钮时,表单的内容会被传送到另一个文件。表单的动作属性定义了目的文件的文件名。由动作属性定义的这个文件通常会对接收到的输入数据进行相关的处理。

<form name="input"action="html_form_action.asp" method="get">

用户名:

<input type="text" name="user" /><input type="submit" value="点这里提交" /></form>

浏览器显示如图效果

假如您在上面的文本框内键入几个字母,然后点击确认按钮,那么输入数据会传送到 "html_form_action.asp" 的页面。该页面将显示出输入的结果。

form标签的action属性的作用解释:

1.action=""和action="#"、没有action属性的作用相同,都是提交到当前页面(也就是document.location.href)

2.action=http://currentPage.xxx":如果http://currentPage.xxx表示当前页面,则提交到当前页面,同事跳转到当前页面,当然就看不到url的变化;如果http://currentPage.xxx是非当前页面,则提交到非当前页面,也跳转到非当前页面

3.表单提交到自身时 action="" 与 action="http://currentPage.xxx" 的区别:

通常为了省事 , 我们一般将表单的 action 属性设为 action=""/action="#",或者干脆不写,但是这会造成一个问题 , 就是其实将 action 设为 action="" 时 , 表单提交时真正提交的页面是action="currentPage.xxx?arguments=values&….", 也就是如果当前页面带有参数 , 参数也一并会提交 , 而且参数的优先级会高于 <form> 控件提交的参数,即如果 action="currentPage.xxx?arguments=values&…." 中的 arguments 有与 <form> 元素名相同的时候 ,获取值时 action=”currentPage.xxx?arguments=values&….” 值会将 <form>的值覆盖,从页得到不正确的值.

例 : SpecTop.asp 页面是表单要提交的页面 , 且有从上级页面传递过来参数

action="" 真正提交时的页面 : SpecTop.asp?ClassID=000100200005&SpeID=947&SpeType=3

如果<form> 中有 <input type=”text” name=”SpeID” value=”1000”/>, 提交时得到的值将会是 947, 而不是 1000, 而 action=”currentPage.xxx” 就能得到1000

从最零基础开始的的HTML+CSS+JavaScript。jQuery,Ajax,node,angular框架等到移动端HTML5的项目实战【视频+工具+系统路线图】都有整理,在线解析,学习指导,点:【WEB前端学习圈⑤】

a jquery 标签点击不跳转_form标签的action属性怎么用?form标签action属性的用法介绍(附实例)...相关推荐

  1. a jquery 标签点击不跳转_jquery如何才可以让a标签不跳转

    jquery如何才可以让a标签不跳转 发布时间:2020-11-11 10:05:18 来源:亿速云 阅读:75 作者:小新 这篇文章给大家分享的是有关jquery如何才可以让a标签不跳转的内容.小编 ...

  2. jquery mobile的a标签点击无法跳转的问题

    二次开发,遇到些小问题,嘿嘿,终于解决了. 搜出来的结果在此总结一下: 当我们的网站引用了jquery mobile的js后,点击页面的链接,你会发现页面无法跳转,因为jquery mobile默认是 ...

  3. a jquery 标签点击不跳转_jquery怎么让a标签不跳转?

    jquery让a不跳转的方法: 1.jquery中可以通过attr()方法设置a标签中的href属性为"#"来使a标签不跳转$(document).ready(function ( ...

  4. 点击链接跳转到新页面并显示对应的tab标签页切换

    原理:从页面A跳转到页面B,则在A页面中跳转页面时传值,然后在B页面中写js获取该值并做对应的操作 附:tab标签页的制作链接:https://mp.csdn.net/postedit/1010531 ...

  5. Vue:a标签点击和file-saver实现文件下载

    目录 方式一:a标签点击实现 方式二:file-saver实现保存 方式一:a标签点击实现 <template><div class=""><el-b ...

  6. action请求是什么意思_html form标签的action属性是什么意思?又有哪些用法?(附实例)

    本篇文章主要的介绍HTML form表单标签的action属性的用法,用法介绍和实例等都在里面,现在让我们一起来看吧 首先我们先来介绍一下关于HTML form标签的action属性的意思: form ...

  7. html form标签的action属性是什么意思?又有哪些用法?(附实例)

    本篇文章主要的介绍HTML form表单标签的action属性的用法,用法介绍和实例等都在里面,现在让我们一起来看吧 首先我们先来介绍一下关于HTML form标签的action属性的意思: form ...

  8. 判断form表单里面的元素属性是否有数据_html form标签的action属性是什么意思?又有哪些用法?(附实例)...

    本篇文章主要的介绍HTML form表单标签的action属性的用法,用法介绍和实例等都在里面,现在让我们一起来看吧 程序猿的生活:打造全网web前端全栈资料库(总目录)看完学的更快,掌握的更加牢固, ...

  9. html标签的action属性,html form标签的action属性是什么意思?又有哪些用法?(附实例)...

    本篇文章主要的介绍HTML form表单标签的action属性的用法,用法介绍和实例等都在里面,现在让我们一起来看吧 首先我们先来介绍一下关于HTML form标签的action属性的意思: form ...

最新文章

  1. 解决Docker容器内访问宿主机MySQL数据库服务器的问题
  2. 【PM模块】维护业务处理流程—内部维护(通知单)
  3. redmine 邮件发送问题修复
  4. 北斗导航 | 学习PPP和PPP-RTK
  5. 关于分布式计算的一些概念
  6. 写出gradle风格的groovy代码
  7. bzoj1211: prufer序列 | [HNOI2004]树的计数
  8. Java学习笔记——final
  9. 理解Java主函数中的String[] args
  10. android代码打包so,AndroidStudio jni开发入门及打包so库和jar包
  11. 模仿人人网客户端应用源码
  12. python文件对象提供了3个读方法、分别是-案例驱动式Python基础与应用-超星尔雅-学习通-题库零氪...
  13. 安:[摩斯密码表]摩斯密码对照表
  14. ATA和ATAPI类型硬盘区别方法
  15. NS3使用Eclipse配置
  16. 符号——Alt+数字键
  17. c语言爱心代码我爱你,C语言告白代码,一闪一闪亮晶晶~
  18. 保龄球计分c语言,保龄球的好处、起源、计分规则、常用技法
  19. 软件项目工作量评估法——功能点估算(FPA)(一)初识
  20. 所谓的光辉岁月,并不是后来闪耀的日子,而是无人问津时你对梦想的偏执。

热门文章

  1. alc236黑苹果驱动_台式机黑苹果独显驱动
  2. 怎么打开网络访问 计算机共享,电脑只要打开共享提示“无法启用共享访问”如何解决...
  3. html设计动画小黄人,CSS3实现可爱的小黄人动画
  4. 电脑公司Win11 64位全新旗舰版镜像V2021.08
  5. windows7怎么清空电脑只剩系统
  6. websocket 学习--简单使用,nodejs搭建websocket服务器,到模拟股票,到实现聊天室
  7. Java数据库篇5——事务
  8. WebMvcConfigurerAdapter过时的替换方法
  9. 操作痕迹包括那些_高级消防设施操作员专题之:走近气体灭火系统
  10. linux2019内核版本发布,求问Linux最新内核版本以及发布日期。