关于form提交后，不重新跳转下一页的问题。

最新推荐文章于 2024-03-03 22:05:39 发布
原创 最新推荐文章于 2024-03-03 22:05:39 发布 · 2k 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#iframe #action #服务器

本文介绍了一种利用iframe实现在提交表单后不跳转页面而只刷新局部内容的方法。这种方法适用于希望在当前页面展示提交后反馈信息的场景。文章提供了一个具体的实例，展示了如何设置表单的target属性为特定的iframe，从而使服务器返回的内容只在该iframe区域内显示。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

当你想在当前页显示提交后的信息内容，而不是想重新定位到新的页面。那么iframe，可以解决这一问题。

实例：

....

<form target="excelUploadFrame" action="请求"> 

</from>

<iframe id="icc.export_customer.upLoadIframe" name="excelUploadFrame" width="100%"   src=""  >
  
  </IFrame>

...

当提交后，通过target定位到iframe 在该页面iframe 区域会显示服务器返回的信息。

wangzhuoyan
关注
使用antdDesignPro创建分步表单
qq_35191010的博客
04-03 1928
antdesignPro中的分布表单 自定义按钮
django带查询分页点下一页（含前一页、首页末页）时查询条件丢失
liuxings382的博客
01-04 680
在使用django分页功能时，如果list添加了查询功能，当点下一页时，查询条件会被清空，返回的下一页是全量数据的下一页。
form表单提交后页面的跳转
u011079727的专栏
10-22 1万+
使用easyui的form表单登录后想跳转到主界面，发现老是不跳转(我用的是struts2的跳转机制),害我总以为是struts2出了问题， 后来发现easyui的form有回调机制。 解决方案： 在界面中使用js进行跳转。 function regUser(){  //通过form的submit方法提交  $('#user_login_loginForm').form('submit',{   
antdDesign ProComponents
最新发布
1234
03-03 657
使用方便，可以对每步进行缓存 （普通antDesign的step 没有缓存）
前端初学者的Ant Design Pro V6总结（下）
SpringWaterLikeMe
12-04 3140
Antd Pro 相关配置、Pro Component 组件配置
element的步骤条整合表单（steps+form）
热门推荐
suqinyi的博客
05-12 2万+
先上效果图： element ui 组件库官网 使用步骤： 1、页面组合步骤 ==> 5步 定义出4个步骤（看你自己需要几步） 定义form表单 定义4个盒子对象active属性 => 1 到 4 放置表单项 设置上一步和下一步的按钮 <template> //第一步:定义出4个步骤 <el-steps :active="active" finish-status="success"> <el-step title="第一步" />
html点击提交后跳转到下一页之前弹出等待框
06-02
4. 在表单提交成功后，再隐藏等待框。 下面是一个示例代码： HTML部分： ```html ;"> 处理中，请稍候... <form> <!-- 表单元素 --> <button type="submit" onclick="submitForm()">提交 </form> ``` CSS部分...
ASP.Net中表单POST到其他页面的方法分享
01-01
但是在ASP.NET中，服务端表单通常都是提交到本页面的，如果我设置 代码如下:form1.action=”test.aspx”;那么就会导致视图验证错误的错误，因为Asp.net安全机制引起的。我们也可以关闭这个验证，在接受页面中（test....
怎么修改这段代码使点击submit按钮后跳转到下一页之前弹出等待框<form action="/login",method="get"> <div class="item"> <input type="text" name="nm"> <label for="">用户ID</label> </div> <button type="submit" class="btn">submit <span></span> <span></span> <span></span> <span></span> </button> </form>
06-02
// 在两秒后提交表单，模拟等待效果 }); ``` 4. 定义一个函数，用于创建等待框。 ``` function createLoading() { const loading = document.createElement('div'); loading.classList.add('loading'); return...
关于layui table表格（table.render）设置搜索之后无跳转，执行修改操作之后刷新当前页
qq_40191985的博客
10-15 3470
关于layui table表格（table.render）设置搜索之后无跳转，执行修改操作之后刷新当前页，不跳转至第一页的解决方法，主要的就是页面表格渲染的时候，就要把数据先渲染好，这样就可以保留选择项了，其次就是当打开一个新页面的时候加载父级的showroom方法,在这个方法里面，我把选择项和填写项重新赋值，然后重载table表格,并做了表格加载页锁定。 首先创建一个搜索项目 <form class="layui-form" lay-filter="room_search">
分步表单_创建多步骤表单的分步指南
编程故事的地方
02-16 3266
分步表单 最近，我想在我的网站上添加一个多步骤表单。 由于我的站点在静态页面生成器Hexo上运行，因此我对如何执行此任务有些疑问。 我的网站上已经有一个静态表单，我不想花太多时间在功能开发上，例如步骤，显示/隐藏逻辑或验证。 我很高兴得知Kwes现在提供了多步骤表单功能 。 在告诉我如何做之前，让我们看看什么是多步骤表单，有时也称为多页面表单。 多步骤表格 多步骤表单是分解成多个片...
Step form wizard design
wwq518的博客
11-06 800
wizard
form表单提交时不跳转页面的实现方式
well2049的博客
11-29 4042
使用ajax 来进行表单就可以了。 使用jQuery的$(“#formId”).serialize();序列化一下数据格式。 记得要引入jQuery。还有设置提交按钮的type不能是submit。function getPHP() { var data = $("#formId").serialize(); console.log(data);
彻底解决刷新重复提交问题
大森林的专栏(Jack Wu)
10-15 850
以前也研究过,始终没找到好的办法,看了微软Msdn上的解决方案,使用后发现存在较多漏洞,考虑的情况太少,如页面加载后没有提交,始终刷新,在同一浏览器打开多个各选项卡,每个选项卡打开同一页面或不同页面,以下是我的解决方案,public class RefreshServe : System.Web.UI.Page    {        private static ILog log = Log
要再次显示该网页 Internet Explorer 需要重新发送您以前提交的信息
冯索的专栏
08-15 7154
不重新发送信息，则无法刷新网页。请单击“重试”再次发送信息，或单击“取消”返回正查看的页。  相信很多朋友都遇到这个问题。现有一个方法可以避免发生这个讨厌的弹出对话框。在网上很多人都 用：opener.window.location.href = opener.window.location.href 来实现，但如果当翻页到第二或第三页时就发发现页面回到第一页了。  我现向大家提供一个方法就是
关于如何解决form表单提交不跳转其他页面的方法-------重定向
qq_43910202的博客
02-07 6423
这是我的博客网址 https://blog.youkuaiyun.com/qq_43910202 在我做项目的过程中，我遇到一个相对棘手的难题。我想利用form表单，向后台提交数据的时候，总会跳转到另外一个页面，让我很苦恼。 这是我做的一个请假系统（内容是我自己编的，不是真实的信息，只作为参考） 当我点击选项并提交之后系统会跳转到一个页面，这个问题苦恼了好久。 这是前端页面，我用jsp写的...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值