当前位置: 代码迷 >> 综合 >> 浏览器默认回车事件
  详细解决方案

浏览器默认回车事件

热度:86   发布时间:2023-10-25 00:21:03.0

 今天项目发版,遇到一个抓狂问题:

如下的表单,没有绑定回车事件,但是只要点击回车会重新加载页面。无论使用什么方法去限制回车事件都无济于事。

<el-form @submit.prevent="onSubmit" :model="form" ref="formRef" :rules="rules1"><div class="el-message-box__content validTagName" style="margin-top: 0px;"><div class="el-message-box__message"><!-- v-bind:manual=true v-bind:disabled="validateStatus" :value="validateStatus1" :v-model="validateStatus1"--><el-form-item prop="tagName"><el-tooltip class="item" :content="errorMessage" :manual="true" :value="papor" placement="top"><el-input v-model="form.tagName" class="tag-cursor"  placeholder="请输入不多于10个长度的标签名"  size="small"></el-input></el-tooltip><div class="el-message-box__btns" style="text-align: center;padding-top: 13px;"><el-button type="default" size="small" @click.native="noSure">取消</el-button><el-button type="primary" size="small" @click.native="sure" style="margin-left: 0px;">确定</el-button></div></el-form-item></div></div></el-form>

 最后公司大神给出解释

form表单中如果只有一个input输入框,浏览器默认会将回车事件绑定为submit。

解决办法:

在表单内添加一个隐藏的input即可

<input type="text" style="display:none;">

 

  相关解决方案