news 2026/10/15 21:17:25

那在HTML中,action是什么

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
那在HTML中,action是什么

在 HTML 中,action是<form>(表单)元素的一个属性,用于指定表单提交时数据发送的目标 URL。


基本语法

<form action="目标地址" method="请求方法"> <!-- 表单内容 --> </form>

作用说明

  • 当用户点击提交按钮(如<input type="submit">或<button type="submit">)时,浏览器会将表单数据发送到action属性指定的 URL。
  • 若未设置action,默认提交到当前页面 URL(即刷新当前页)。

示例

1. 提交到服务器接口

<form action="/submit-form" method="POST"> <input type="text" name="username" placeholder="用户名"> <input type="password" name="password" placeholder="密码"> <button type="submit">登录</button> </form>

用户点击“登录”后,数据会被 POST 请求发送到/submit-form。


2. 使用完整 URL(跨域提交)

<form action="https://api.example.com/register" method="POST"> <input type="email" name="email" required> <button type="submit">注册</button> </form>

3. 不设置action(默认行为)

<form method="GET"> <input type="text" name="search"> <button type="submit">搜索</button> </form>

表单提交时会刷新当前页面,并将数据附加到 URL 查询参数中(如?search=关键词)。


配合属性

  • method:指定 HTTP 请求方式(GET或POST)。
  • enctype:指定表单数据编码方式(如上传文件时用multipart/form-data)。

与 JavaScript 结合

即使使用 JavaScript 处理表单(如 AJAX),保留action有助于语义化和降级兼容(即 JS 失效时仍可提交):

<form action="/backup-submit" method="POST" onsubmit="handleSubmit(event)"> <input type="text" name="message"> <button type="submit">发送</button> </form>

总结

属性作用默认值
action表单提交的目标 URL当前页面 URL
method请求方式(GET/POST)GET
enctype数据编码格式application/x-www-form-urlencoded

✅核心理解:action告诉浏览器:“把数据送到哪儿去”。

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/10/15 20:45:02

科哥打造的CAM++系统到底好不好用?实测告诉你答案

科哥打造的CAM系统到底好不好用&#xff1f;实测告诉你答案 1. 上手初体验&#xff1a;界面简洁&#xff0c;功能明确 第一次打开科哥开发的 CAM 说话人识别系统&#xff0c;第一感觉是——干净、直观。不像一些复杂的AI工具需要翻文档才能搞懂怎么用&#xff0c;这个系统的W…

作者头像 李华
网站建设 2026/10/14 16:53:59

比手动调试快10倍:AI自动修复Vue props错误

快速体验 打开 InsCode(快马)平台 https://www.inscode.net输入框内输入如下内容&#xff1a; 构建一个性能对比工具&#xff1a;1. 自动生成包含props修改错误的Vue组件样本&#xff1b;2. 实现传统人工调试流程的时间记录&#xff1b;3. 使用AI自动修复流程的时间记录&…

作者头像 李华
网站建设 2026/10/15 5:04:34

CUDA十年演进

过去十年&#xff08;2015–2025&#xff09;&#xff0c;CUDA 从“GPU 并行编程接口”演进为“覆盖编译器、运行时、库与框架的加速计算平台”&#xff1b;未来十年&#xff08;2025–2035&#xff09;&#xff0c;它将以异构协同、编译化与 AI 原生为主线&#xff0c;继续作为…

作者头像 李华
网站建设 2026/10/14 10:30:17

零基础教程:5分钟学会ECharts词云制作

快速体验 打开 InsCode(快马)平台 https://www.inscode.net输入框内输入如下内容&#xff1a; 创建一个极简ECharts-wordcloud教学示例&#xff1a;1.分步骤代码生成过程展示 2.每个配置项用通俗语言解释 3.可编辑的简单数据集&#xff08;如水果名称和喜爱度&#xff09;4.包…

作者头像 李华
网站建设 2026/10/15 4:18:17

Kernel十年演进

过去十年&#xff08;2015–2025&#xff09;&#xff0c;操作系统内核&#xff08;以 Linux 为代表&#xff09;从“稳定的单体内核”演进为“高度可配置、云原生、面向异构硬件与 AI 工作负载的系统核心”&#xff1b;未来十年&#xff08;2025–2035&#xff09;&#xff0c…

作者头像 李华
网站建设 2026/10/14 21:05:04

FSDP十年演进

过去十年&#xff08;2015–2025&#xff09;&#xff0c;Fully Sharded Data Parallel&#xff08;FSDP&#xff09;从“学术界探索的显存节省方案”演进为“PyTorch 原生、工业级的大模型并行训练基础设施”&#xff1b;未来十年&#xff08;2025–2035&#xff09;&#xff…

作者头像 李华