element+Vue el-form组件进行查询时,当输入框仅有一项时,回车自动提交表单,浏览器会刷新页面
vue的写法就是el-form上添加阻止默认事件 @submit.native.prevent
<el-form
ref="queryForm"
label-width="120px"
:model="form"
:rules="rules"
:show-message="false"
size="mini"
@submit.native.prevent
>
</el-form>
项目中使用的是jsx的语法,修改为
return (
<el-form
{...{
class: "", // ofxh
on: {
input: noop, },
nativeOn:{//监听事件
submit: handlePrevent //阻止事件
},
props: {
model: this.formData,
rules: rules,
inline: this.inline,
disabled: this.disabled,
"label-position": this.labelPosition,
"label-width": this.labelWidth,
"label-suffix": this.labelSuffix,
"validate-on-rule-change": false
},
ref: "form",
key: "form"
}}
>
{formItemList}
{this.$slots.inline}
</el-form>
); 阻止事件
const handlePrevent=function(event){event.preventDefault()};
element+Vue el-form组件进行查询时,当输入框仅有一项时,回车自动提交表单,浏览器会刷新页面的更多相关文章
- 用layui的 form.on提交表单如何禁止刷新页面
答:只需要在 form.on里面的底部添加return false;即可 例如: form.on('submit(component-form-demo1)', function(data){ var ...
- form表单下的button按钮会自动提交表单的问题
form表单下的button按钮会自动提交表单的问题 2017年01月05日 18:02:44 蓝色水 阅读数:18012更多 个人分类: asp.net form表单下的按钮在没有指定type类 ...
- 如果没有<form>标签,也没有enctype="multipart/form-data"属性,怎么使用formData对象提交表单呢?如下方式
form标签的enctype属性 enctype 属性规定在发送到服务器之前应该如何对表单数据进行编码. 默认地,表单数据会编码为 "application/x-www-form-urlen ...
- form中的button按钮在IE11中自动提交表单问题导致弹出框关闭之后表单被重置
最近几天,测试系统,遇到一个兼容性问题,form中有一个button按钮,没有指定type类型,点击按钮弹出框选择值之后回填给form上的一个单行文本框,在IE6.IE7.IE8.IE9.IE10中测 ...
- 使用 elementUI 的表单进行查询,表单中只有一个文本框时,回车会自动触发表单的提交事件,导致页面的刷新。
使用elementUI的el-form组件进行查询时,当输入框仅有一项时,回车自动提交表单,浏览器会刷新页面: 原因:由于当表单只有一个文本框时,按下回车将会触发表单的提交事件, 从而导致页面刷新. ...
- 回车禁止form提交表单
今天遇到回车自动提交表单特此记录下 document.getElementsByTagName('form')[0].onkeydown = function(e) { var e = e || ev ...
- SpringMVC(十四):SpringMVC 与表单提交(post/put/delete的用法);form属性设置encrypt='mutilpart/form-data'时,如何正确配置web.xml才能以put方式提交表单
SpringMVC 与表单提交(post/put/delete的用法) 为了迎合Restful风格,提供的接口可能会包含:put.delete提交方式.在springmvc中实现表单以put.dele ...
- form表单action提交表单,页面不跳转且表单数据含文件的处理方法
在最近的项目中需要将含 input[type='file']的表单提交给后台 ,并且后台需要将文件存储在数据库中.之前所用的方法都是先将文件上传到七牛服务器上,然后七牛会返回文件的下载地址,在提交表单 ...
- 阻止form元素内的input标签回车提交表单
<form></form>标签内input元素回车会默认提交表单. 阻止回车默认提交表单: $('form').on('keydown', function (event) { ...
- 解析:使用easyui的form提交表单,在IE下出现类似附件下载时提示是否保存的现象
之前开发时遇到的一个问题,使用easyui的form提交表单,在Chrome下时没问题的,但是在IE下出现类似附件下载时提示是否保存的现象. 这里记录一下如何解决的.其实这个现象不光是easyui的f ...
随机推荐
- [OpenCV实战]28 基于OpenCV的GUI库cvui
目录 1 cvui的使用 1.1 如何在您的应用程序中添加cvui 1.2 基本的"hello world"应用程序 2 更高级的应用 3 代码 4 参考 有很多很棒的GUI库,例 ...
- 一文了解华为FusionInsight MRS HBase的集群隔离方案RSGroup
摘要: RSGroup是集群隔离方案. 本文分享自华为云社区<华为FusionInsight MRS HBase的集群隔离--RSGroup>,作者: MissAverage. 一.HBa ...
- [cocos2d-x]关于定时器
什么是定时器 定时器的作用就是每隔一段时间,就执行一段自定义的动作,比如飞机向前方移动,子弹的移动等等.该函数定义在CCNode头文件中,基本上cocos2dx中所有的东西都能够使用定时器. 定时器的 ...
- UOJ60.【UR #5】怎样提高智商
简要题意 谜题集中有 \(n\) 个谜题,第 \(i\) 个谜题形如: \(i.\) 编号小于 \(i\) 的题目中你选择了几个 \(h_i\)? A. \(a_i\) B. \(b_i\) C. \ ...
- 创建a标签使用get请求下载文件
创建a标签使用get请求下载文件 let url = `${BaseUrl.path}/aa/bb/cc?no=${this.sqcode}&pae=${this.wlName}&as ...
- BC7-牛牛的字符矩形
题目描述 牛牛尝试用键盘读入一个字符,然后在屏幕上显示用这个字符组成的 3*3 的矩形. 输入描述 一行读入一个 char 类型的字符. 输出描述 输出这个字符组成的 3*3 矩形. 示例 1 输入: ...
- JavaScript 中更安全的 URL 读写
前言 URL对于我们开发人员来讲,应该是非常熟悉了.在对URL进行参数拼接时,我们一般都会直接进行字符串拼接或使用模版字符串,因为这样非常方便,但是我们这样其实会在不知不觉中以不安全的方式编写 URL ...
- file过滤器的原理和使用-FileNameFilter过滤器的使用和lambda优化程序
file过滤器的原理和使用 java.io.FileFilter是一个接口,是File的过滤器.该接口的对象可以传递给File类的listFiles(FileFilter)作为参数,接口中只有一个方法 ...
- TCP/IP RTT算法比较
TCP重传机制Timeout特点: 设长了,重发就慢,效率和性能差: 设短了,重发就快,可能导致没有丢就重发,增加网络拥塞,导致更多的超时,更多的超时导致更多的重发. TCP协议引入2个概念: RTT ...
- 手写一个audio播放器,实现歌曲切换,列表歌曲循环,音量调节等 vue组件
1 <template> 2 <div class="wrapper"> 3 <svg 4 t="1673833915638" 5 ...