移动端搜索按钮提交form表单不刷新页面

2017-10-12 00:40
椰子皮
2592
0
6
移动端

像很多页面都只有一个舒如宽,提交按钮没有,而且提交按钮在移动端显得很不友好。

单独一个输入框怎样提交表单而且不刷新当前页面;在vue这种单页面应用中,如果刷新了整个页面,那体验就非常差了。

使用 type="search",手机端的键盘会出现搜索按钮,其实等同于回车,有些是“go”字样,

在form上面加上 onsubmit="return false"阻止刷新,

在input标签上加上onsearch事件,这样就能愉快的输入完后点搜索按钮实现不刷新页面触发事件。

Screenshot_2017-10-11-16-24-08-150_com.tencent.mo.png
复制代码
<div class="hns-input">
    <form onsubmit="return false;"  action="">
        <input type="search" v-model="keywords" placeholder="请输入关键词" @search="findBuss();"/>
    </form>
</div>
赏
支付宝微信
6
关注公众号获取更多内容
jquery判断滚动到底部
一则关于js数组的前端面试题
暂无评论,快抢沙发吧
不支持canvas