Form表单提交且不刷新页面的简单实现

墨衍会员 · AI 创作全网分发 墨衍智能分发 本文由作者通过墨衍一键同步至各平台 1分发平台 5.6k累计阅读 5.7k平均单平台已同步平台优快云微信公众号微博知乎掘金百家号博客园抖音小红书 你的文章也可以这样分发 墨衍会员 ¥399起/年，写一次发全网我也要 → 码龄9年

关注

原创最新推荐文章于 2026-09-14 13:36:30 发布 5.6k 阅读 AI 写同款· GEO 优化 ›

js实现表单提交后不重新刷新当前页面本文介绍了如何通过js实现表单提交后不重新刷新当前页面的方法实例.既提交了FORM保存了数据,页面也不会跳转，很实用。需要的朋友可以参考下立即下载

form表单在点击提交后会刷新整个页面，有时会影响网页功能和效果
使之不刷新的解决思路：给form表单指定一个隐藏的iframe，这样提交表单后刷新的就是那个iframe而不是整个页面了

iframe：

<iframe name="hidden" style="display:none;"></iframe>

form：

<form name="form" method="post" target="hidden">
    表单内容
</form>

收录于

前端

当前文章被收录于：

前端

16 篇文章 0 人学习

订阅专栏查看详情

当前文章被以下社区和专栏收录：

标签

#form #刷新 #表单 #前端 #iframe

Security Onion的部署(超详细) 本文介绍了开源入侵检测系统securityonion的部署阅读详情

相关推荐

网络工程系统CAD图：从设计到落地的关键技能与实战指南

网络工程并不只是配置路由器和交换机，真正的核心在于将设计方案转化为可施工的物理图纸。网络工程系统CAD图正是连接逻辑设计与物理世界的桥梁，它涵盖综合布线、信息点布置、桥架路由、弱电间规划等关键内容。理解并掌握这套图纸体系，是网络工程师从基础设备调试走向项目主导者、弱电总工乃至网络架构师的重要分水岭。在园区网、数据中心、智能楼宇等真实场景中，一套规范的系统CAD图直接决定了施工质量、验收效率与后期运维的可靠性。本文从基础概念出发，拆解图纸的组成层次、绘制流程和软件工作流，并结合学习路线与就业方向，帮助初学者建

weixin_33860553的博客 389

form表单提交不刷新页面

form表单提交时，往往会刷新页面，数据提交到后台会跳转到其他页面如果不需要刷新页面时，可以通过ifame实现无刷新。在form表单下定义一个ifame , 将form的target属性指向frameFile，这样就实现了不刷新页面的form提交。

菜鸟小灰灰的博客 1万+

（详细教程）opencv+pycharm+笔记本摄像头做一个人脸识别

文章目录前言一、pandas是什么？二、使用步骤 1.引入库 2.读入数据总结一、安装opencv-python 这里推荐使用pycharm直接安装opencv-python 打开文件——设置——python解释器——点击+号搜索opencv-python,点击安装包，等待片刻即可安装好检查是否安装好，新建一个项目输入以下代码，若无报错则安装好 import cv2 二、准备分类器咱们使用opencv官方提供的分类器，包括面部识别，侧...

qq_52852432的博客 1万+

如何阻止 form 表单提交后刷新页面？

qq_40147756的博客 1359

得物APP破解

本文介绍了得物App（版本4.74.5）的逆向破解过程，重点分析了绕过强制更新、抓包技巧以及破解newSign参数的详细方法。首先通过断网再联网的方式绕过强制更新，然后使用SocksDroid进行抓包分析，发现首页推荐接口需要newSign参数。通过反编译定位到RequestUtils.c方法，利用Frida进行Hook验证，最终解析出newSign的生成逻辑：将请求参数加入固定字段后排序拼接，再进行MD5加密生成签名。文中提供了完整的Hook脚本和签名算法分析，仅供学习移动安全技术参考。

m0_74653634的博客 3472

什么是论文的创新点？公式化描述算是创新点吗？

写科研论文时，挑战之一就是如何让你的工作“脱颖而出”，也就是要有创新性。不管实验多么精确、推导多么复杂，若没有真正的创新，论文很可能会被拒。关于如何创新问题上，我最近在看刘雪峰老师的《科技论文写作指南》，看到了很多关于写作的新论述，在这里和大家进行分享。

加百力的技术博客 1924

jQuery实现form表单基于ajax无刷新提交方法

一级标题 jQuery实现form表单基于ajax无刷新提交方法: <style> *{ text-align: center; } body{ background-color: #2F4F4F; } .input{ width: 400px; height: 40px; border-radius: 10px; border: 0; /* margin-

qq_43209524的博客 546

YOLOv13添加OREPA模块准确率提升10.56个点，map提升11.87个点。小目标轻量化

本文提出了一种新的OREPA（Optimal Recursive Edge-Preserving Attention）模块，通过结合递归和边缘保留注意力机制，显著提升了目标检测模型的性能。实验结果表明，添加OREPA模块后，准确率提升了10.56个百分点，mAP提升了11.87个百分点。OREPA模块包含三个核心组件：OREPA1处理特征图并保留边缘信息，Bottleneck_OREPA作为瓶颈模块降低计算量，OREPA类通过堆叠多个Bottleneck_OREPA增强网络表达能力。文章详细介绍了如何将OR

FJN110的博客 2760

form表单无刷新提交

最近在处理一个界面，界面中有实时统计数据量的websocket,还有一个下载文件功能，下载采用的是form表单提交的方式，而正常的form表单提交势必会引起页面刷新（隐藏的），而websocket一旦在操作完下载后就会断开，表面上看两者是相互矛盾的，以下是解决步骤：一：考虑从websocket入手；网上有很多websocket的心跳机制啥的，但是此阶段对websokcet只是初探阶段...

白不懂黑的静的专栏 1337

基于Simulink的PID控制器自动驾驶仿真建模示例

本文通过Simulink仿真平台，详细讲解了基于PID控制器的自动驾驶路径跟踪实现方法。主要内容包括：1）建立自行车运动学模型作为被控对象；2）定义参考路径与横向误差计算方法；3）设计PD控制器并调试参数；4）在Simulink中搭建完整仿真模型；5）分析30km/h车速下的双移线跟踪性能。文章强调PID控制作为自动驾驶入门基础的重要性，并指出其在中低速场景下的适用性，同时给出了工程实践中的优化建议（如前视距离、抗积分饱和等）和扩展方向（如Stanley控制器）。通过完整案例，帮助读者掌握车辆运动学建模和P

xiaoheshang_123的博客 64

RFC 字符码转换深度解析：Unicode、非 Unicode 与 MDMP 系统的协奏

老版本 MDMP 系统不上传自定义映射时，Unicode 端会落回“预配置列表”。列表里可见西欧 1100、日文 8000、中文 8400 等经典编号。若需强制覆写映射，可在 SM59 ➡Unicode页签启用，或直接勾选作为兜底。字符编码问题常“潜伏”多年，一旦旧系统升级或新增语种便集中爆发。掌握 RFC code page 转换机理、灵活运用 SM59 选项、在早期对 LANG 字段和字段长度进行治理，是根治乱码与 short dump 的关键。

2007 年 ~ 2025 年，深耕 SAP 技术 18 年 222

form表单提交后不刷新页面

https://blog.youkuaiyun.com/yuuuuchang/article/details/78982590?tdsourcetag=s_pcqq_aiomsg 看了上面链接的，我只有以下方法才适用。。我们在绑定onsubmit的时候是把returnfalse放进onsubmit后面的调用函数内的, 这样子如果你的函数出现了错误,将不会继续执行到函数最后'returnfa...

weixin_30566111的博客 910

【WRF模拟】保存wrf输出文件到指定目录+仅输出指定空间域/变量文件

修改wrf命令以更改指定输出文件目录等

WW、forever的博客 543

html实现form表单提交后不重新刷新页面

今天在实现ajax异步传输form表单数据时，测试时查看返回的错误信息，但是每次都会重新刷新页面。百度查了下解决办法，总结一下：在form表单后添加一个iframe标签，属性设为隐藏,form表单中target属性值设为iframe标签的名字。代码如下： <html> <body> <form action="user" method="post" target=...

LrvingTc的博客 1万+

IDEA的使用指南

IDEA基于java的使用手册,可以最快速的上手,在使用中不断的丰富自己的使用技巧.

pscad IEEE标准系统搭建说明

pscad IEEE标准系统搭建说明，包含典型的IEEE 9节点、14节点、30节点、39节点和118节点系统。内含标准测试系统的原始数据和潮流结果。

jquery实现form表单提交后局部刷新页面的多种方法

最近做一个小项目，刚好需要用到搜索功能，实现搜索框内输入数据然后按回车或者点击“提交”，然后给后台数据库处理并返回数据给前端，在前端局部更新数据。比如这样的：但是遇到了一个小问题，就是form表单下任意输入框输入完按回车提交，整个页面都会刷新，就算我用ajax从后台取出数据返回前端把页面更新了，整个页面还是会立马刷新成原来的样子。所以问题又回到了最开始，就是form表单如何实现按回车提交数据处

sajiazaici的博客 8551

SIMATIC S7-1200, S7-1500 PID 控制[手册]

怎么实现表单提交后不重新刷新当前页面

如何实现表单提交后不重新刷新当前页面　　　　当我点击保存提交FORM表单后,如何让当前页面维持不变(即不刷新当前页)？在FORM表单后添加一个iframe，即<form name='form1' id='form1' action='/xbcw/cw/xx_xx.action' method='post' target="rfFrame">

melody_day的博客 2万+

老版QQ原生表情gif动态

这是老版的QQ表情，不过全是动态的的，Windows照片查看器是不会动的，可以右击用浏览器打开查看，再说一遍是老版的，只是分享给宁愿用老版也要动态的人。

html 提交表单后页面不跳转且不刷新当前页面

原文链接：https://blog.youkuaiyun.com/a2524289/article/details/78782318 希望提交表单后页面不跳转且不刷新当前页面，然而查了很多方法都没有解决。由于Form 是提交后一定刷新页面的，所以我们可以用一个折中的办法。我们给Form 指定一个iframe，这样表单提交后刷新的就是我们指定的iframe 而不是页面了。 <iframe id="fra...

muwuren的博客 2419

form表单的submit不重新刷新当前页面

如何实现表单提交后不重新刷新当前页面 <form name='form' id='form' action='xxx.action' method='post'> 　　<input type="submit" id="btnSubmit" name="btnSubmit" value="保存" /> </form> 当我点击保存提交FORM表单后,如何让当前页...

weixin_44999830的博客 7189

form 表单提交后，使页面不跳转

form 表单提交数据，往往会刷新页面，数据提交后会跳转到其他页面如果不需要刷新页面时，可以通过ifame实现无刷新。在form表单下定义一个ifame 将 form 的 target 属性指向 iframe 的 name 属性，这样就实现了不刷新页面的form提交。示例： <form action="url" enctype="multipart/form-data" target...

qq_42617840的博客 4494

如何让form 表单提交数据后，页面不跳转不刷新？（已解决）

思路：先把写好的iframe标签隐藏起来，给form绑定属性target为和iframe一模一样的值，当点击button进行提交后，就会提交到iframe框里面，这样就不会重新打开一个新页面且成功提交数据 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, .

数据库爆破专家的博客 3313

layui form表单提交后不刷新当前页面

layui 中form.on("submit(search)", function (data) { // some actionreturn false;}); 默认结束后刷新当前页面 1.form表单-后面添加<iframe id="rfgeoupsearchForm" name="rfgeoupsearchForm" src="about:blank" style="display: none;"></iframe> <form class="layui-fo...

笨笨的博客 4791

php form表单提交不刷新,Form提交表单页面刷新不跳转本

如何在 form 表单提交后实现页面不跳转用ajax 提交不要用提交按钮用普通按钮按钮的 click事件中进行ajax 就可以 function sub(){var name= $("#uname").value();$.ajax({ url:url, data:{uname:name}, complete:function (data){ // 这里获取后台数据 DATA 刷新当前页面的...

weixin_36484519的博客 1328

Form表单异步提交，不刷新页面

一.先导入需要用到的js 二.HTML代码注册账户： *必填用户名： *必填

ChenSuoZhang的博客 3275

form表单因某些操作会自动提交并刷新页面，需禁止form的自动提交

一、form表单因某些操作会自动提交并刷新页面测试网页时，发现网页每次都会自动提交，发出请求。经过查找和测试，发现是form表单会自动提交，从而导致页面自动刷新。二、form表单自动提交规则 form表单中只有一个type=text的input（可以有其他类型的表单），在input中按enter键，会自动提交 form表单中有多个type=text的input，且无type=submit的按钮元素，则在input中按enter键，不会自动提交 form表单中有type=su

一片天空 4442

Form表单实现异步的提交

Form表单实现异步的提交问题描述 <form>标签的一般情况下的默认写法是  <form method="" action=""> </form> 但是这样提交form表单是非异步提交，在servlet不改变url的情况下，相当于重新刷新页面，这样就会导致几个问题： 1.浪...

一名假人的博客 4199

解决form表单提交刷新问题

vue + element ui 阻止表单输入框回车刷新页面如果button不设置 type='button' 问题　　在 vue+element ui 中只有一个输入框（el-input）的情况下，回车会提交表单。解决方案　　在 el-form 上加上 @submit.native.prevent 这个则会阻止表单回车提交。测试下面的代码出现表单回车提交 <...