阻止回车刷新页面的方法

最新推荐文章于 2024-08-05 09:21:19 发布

转载最新推荐文章于 2024-08-05 09:21:19 发布 · 278 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/Crazy-D/p/9548761.html

本文介绍了一种防止表单提交时因按下回车键而导致页面刷新的方法。通常，当表单中只有一个输入框时，按回车会触发默认的表单提交行为，导致页面刷新。为避免此问题，可以在表单中添加一个隐藏的输入框，以此来阻止默认的提交行为，从而实现更好的用户体验。

现象：此方法针对于表单提交的时候，回车刷新页面。

原因：造成这种情况的原因一般是form里只有一个input。

解决办法：就是可以添加一个隐藏的input。

<form id="add_strategy" style="display: none">
        <div class="add_strategy_box">
            <label class="gd-label-required">策略名称</label>
            <input type="text" gd-validate="required"  class="gd-input gd-input-lg" v-model="newRuleName">
        </div>
        <div class="add_strategy_box" style="display: none">
            <label class="gd-label-required">阻止回车刷新页面</label>
            <input type="text" class="gd-input gd-input-lg">
        </div>
 </form>

转载于:https://www.cnblogs.com/Crazy-D/p/9548761.html