＜button＞ 按钮在form表单中点击后刷新界面

最新推荐文章于 2024-03-06 15:47:52 发布
原创 最新推荐文章于 2024-03-06 15:47:52 发布 · 1.3k 阅读 · 1 ·
本内容遵循CC 4.0 BY-SA版权协议
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
标签
#html
本文揭示了一个常见的前端问题：当button未设置type属性时，表单会意外刷新。解决方法是在button上添加type=button属性，避免不必要的请求。

button按钮在表单刷新界面原因：

<button>在form表单中，如果没有加属性type="button"时，html界面会自动将button按钮解析为submit按钮，因此会自动发送一次请求，当你form表单中没有地址时，则会自动刷新一次界面，作者我在一个项目中被这个bug困扰了一整天，从前端找到后端，调试一点一点看，仍然迷惑为啥自己的searchBtn会发起两次请求请添加图片描述

明明只发起了一次请求，却执行了两次方法请添加图片描述

解决方法：如图所示将<button > 加入属性
<button type="button" >
即可解决问题

云服务器上部署TensorFlow遇坑实录：libcudnn.so.8找不到？一份详细的CUDA 11.1与cuDNN 8.0.4手动部署指南
最新发布
weixin_30372371的博客
05-21 2244
本文详细记录了在云服务器上部署TensorFlow时遇到的libcudnn.so.8缺失问题，并提供了CUDA 11.1与cuDNN 8.0.4的手动部署指南。通过解析云服务器环境的特殊性，提供定制化安装方案和高级技巧，帮助开发者高效配置深度学习环境，避免常见陷阱。
点击layer弹出层按钮实现弹出层中form表单验证
silversoldier的博客
12-13 1万+
前言 在使用layui弹出层时，想着在点击弹出层中“确定”按钮时，也能触发弹出层中form表单的验证。最后找到一个还算可以的答案，参考https://fly.layui.com/jie/5581/，结合自己的理解，实现了这个功能。 具体实现 整体思路就是在弹出层form表单页面中设置一个隐藏的提交按钮，然后在layer弹出层点击“确定”按钮时，找到form表单中隐藏的提交按钮，触发点击事件，...
asp点击按钮之后自动刷新页面，怎么解决
Lhjuia的博客
02-04 2102
asp点击按钮之后自动刷新页面，日期文本框被清空怎么解决 比如这个界面，进行查询（我设置了日期为今天的默认值，图中是点击查询前） 当我点击查询之后，两个时间输入框立马变成默认（“今天”） 然后我发现，如果我不设置默认值，一进来就是空的话，点击之后就会保留你的选择（我之前做的时候怎么不是这样，记得回被清空的，奇怪，还是我记错了？） 那我就是要设置默认值呢？，又不想让他清空变回默认，一开始我的思路是，变量获取值之后再赋值回去，问题是，不管用啊，因为它刷新了，于是就想到了js中的定时器，还有选择器JQuery，首
如何避免form表单内点击button按钮导致页面刷新？解决方案大揭秘！
weixin_50407990的博客
03-24 3263
在Web开发中，我们经常会使用form表单来收集用户提交的数据，但是有时候在form表单内点击button按钮会导致页面刷新，这对用户体验来说是十分不友好的。默认情况下，form表单内的button按钮的type属性为submit，也就是说，当用户点击这个按钮时，会自动将表单内的数据提交到后台处理。通过本文的介绍，我们了解了form表单内点击button按钮会刷新页面的原因，并掌握了两种避免刷新页面的方法。除了表单提交按钮的默认行为会刷新页面，还有一些其他情况也会导致页面的刷新。
.net按钮防止其自动刷新的问题
XXXXXXXXXXXXXXXY的博客
04-16 2137
在学习asp.net的时候，发现点击button页面总是会自动刷新，在网上查了之后才知道为何，比如 asp的button默认的类型是Submit，它是服务器控件，所以每次点击就会刷新一次。 解决方法一： 把button控件放在updatepanel里 我个人感觉其实际上还是会刷新页面，只不过是通过ajax方式。 解决方法二： 使用HTML的button控件 html的是在客户端的。如果想让按...
button按钮刷新页面的几种方式
码媛小洋的博客
09-29 3954
<input type=button value=刷新 onclick="location.reload()"> <input type=button value=刷新 onclick="location=location"> <input type=button value=刷新 onclick="location.assign(location)"> <input type=button value=刷新 onclick="document.execcom
【已解决！！】el-dialog中el-form里点击button页面自动刷新
weixin_61884901的博客
12-02 948
一直用的elementui就不应该混着button用！
HTML中Form表单的使用
热门推荐
pan_junbiao的博客
06-20 5万+
1、form表单标记 表单标记以<form>标记开头，以</form>标记结尾。在表单标记中可以定义处理表单数据程序的URL地址等信息。 <form>标记的基本语法如下： <form action="url" method="get | post" name="formName" onsubmit="" target=""> </for...
form表单详解
JiuMeilove的博客
07-06 4万+
form表单详解form表单属性 表单在Web网页中用以让访问者输入数据，当提交表单时，表单中输入的数据被打包传递给Web服务器端的程序以处理，从而使得Web服务器与用户之间具有交互功能。 表单实现前后台交互：用户将表单提交到后台再右后台提交到数据库的过程，实现前后端交互。 form表单属性 form支持HTML的全局属性 属性 值 描述 accept MIME_type HTML5 不支持。规定服务器接收到的文件的类型。（文件是通过文件上传提交的） accept-charset cha
element-ui中的el-form表单验证，只有在提交按钮点击时才进行验证
sunmeng_sunmeng的博客
01-08 2万+
element-ui中的el-form表单验证，只有在提交按钮点击时才进行验证，这样会减少消耗。看别人写的文章 ，只有在写怎么添加验证，不能满足我的需求。 其实很简单，直接在el-input上加一个属性就行， <el-input ref="nodeName" v-model="form.nodeName" maxlength="122" show-word-limit :...
form表单提交点击按钮提交form表单
06-14 4779
使用jquery提交form表单 2017-06-14  刘道鑫seq...  转自 I_T_馆 修改 微信分享： 需求是：新增页面，有一个表单要提交，正常直接在action中写url，点击submit按钮就可以提交了，但我希望能够在表单提交之前验证一下文本框内容。于是，使用jquery来验证表单，验证通过后提交form表单。
关于点击 button 自动刷新页面的问题
ginny_mjy的博客
08-20 517
原因： <button></button>如果不设置type属性， 除了 IE 中 默认 type = “button”, 其他浏览器默认 type = “submit” 。点击便会提交表单，刷新页面。 解决办法： 将<button></button>改为<input type="button">或者直接在<button>中添加属性 type=“button”。 阻止默认事件， 在button点击事件中加入“e.preven
点击button按钮自动刷新页面的问题
编码小菜鸟的错误记录
09-18 1702
点击按钮自动刷新了页面 问题 ????在页面上写了一个form表单，表单里面有个button按钮，button绑定了一个ajax提交表单的事件。但点击按钮后发现每次点击按钮后页面给我刷新了，并没有触发ajax请求，将表单提交给后台。 问题排查 首先确定有没有进入ajax的js方法 发现并没有，并没有触发我给他绑定的按钮的点击事件???? 查看form表单的action属性，我的action的属性设置的空，并不想使用form表单的action的方式提交表单，然后就设置的空，这里就埋下了伏笔 怀疑是acti
按钮Button点击后页面刷新咋办？(Web；Html；Css；Javascript)
HowToPause的博客
10-13 4646
在写完页面的一个按钮后，你点击了，发现有反应，嗯嗯没有问题。但是突然你又感觉到不对劲——为啥页面刷新了？其实弄清楚问题的原因解决办法就很好找了。
form表单中的button自动刷新页面问题
leechoy
12-26 2581
form表单中的button自动刷新页面问题 form表单中如果存在button的话，有可能会出现一个问题：点击button，触发了页面的自动刷新事件。 原因是因为标签默认的类型是submit，即默认的button点击就会触发表单的提交事件。 <button></button> <!-- 两者是相当的 --> <button type="sumbit"></button> 解决的办法有三个。 1.在标签中添加属性type=“button”。 2
EBS FORM開發總結 .
a120255857的专栏
04-05 3230
1. 系统的标准form在还没有获得组织参数时会先弹出更改组织的窗口，选取了组织后会继续弹出自己的form窗口，请问这是怎么实现的。     增加Choose ORG功能： (1):首先在parameter中加上CHART_OF_ACCOUNTS_ID，ORG_NAME，ORG_CODE，ORG_ID四个参数 (2)：在form level 的trigger中的pre—form中加上FN
FORM执行查询的各种方法
weixin_30765475的博客
12-20 530
 一.FORM调用FORM后执行查询 1.打开 APPSTAND.fmb，把 Object Groups 下的 QUERY_FIND 对象组拖动到自己的 form 中的 Object Groups 下，点击 copy。 2. 这时在 block、 canvases 和 windows 下多了 QUERY_FIND 修改 Data Blocks 的 QUERY_FIND...
点击按钮实现刷新页面 + 全屏
weixin_45912344的博客
03-06 836
【代码】点击按钮实现刷新页面。
关于 form 表单回车自动刷新
ljqscdnljq的博客
03-10 598
form 表单，在只有一个输入框的时候，在点击回车时，就会触发表单的提交，而 form 若没有 url，则提交后就会刷新页面，导致跳转。本文转载自：https://www.cnblogs.com/ljwsyt/p/11211826.html。知道原因后，可以采用增加一个隐藏输入框的方法，避免回车提交。form 表单，输入框聚焦后，回车，页面刷新跳转。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值