点击键盘上的搜索按钮实现页面跳转

<form action="#list?goods_title={{message?message:''}}" @submit.prevent="onEnvent'>
　　<input class="iconfont" type="search" v-on:focus="searchKeyword" :class="{active: isActive}" v-on:blur="cancelKeyword" v-model="message"/>
</form>

action 后边跟着要跳转的页面及参数

onEnvent函数控制点击搜索按钮时，需要做的一些操作或判断

input type要设置为search

h5移动端设置键盘搜索的更多相关文章

  1. h5移动端常见虚拟键盘顶起底部导航栏解决办法

    在h5移动端开发中相信很多朋友跟我一样都会遇到页面底部导航被虚拟键盘顶起的问题,自己在网上找到的解决办法拿出来与大家分享,有不完美之处还望见谅,有更好的解决办法可以贴出来大家一起互相学习!! var ...

  2. h5 ios输入框与键盘 兼容性优化

    起因 h5的输入框引起键盘导致体验不好,目前就算微信.知乎.百度等产品也没有很好的技术方案实现,尤其底部固定位置的输入框各种方案都用的前提下体验也并没有很好,这个问题也是老大难问题了.目前在准备一套与 ...

  3. H5移动端知识点总结

    H5移动端知识点总结 阅读目录 移动开发基本知识点 calc基本用法 box-sizing的理解及使用 理解display:box的布局 理解flex布局 Flex布局兼容知识点总结 回到顶部 移动开 ...

  4. 旅行app(游记、攻略、私人定制) | 顺便游旅行H5移动端实例

    <顺便游旅行>是一款H5移动端旅行app,提供目的地(国内.国外.周边)搜索.旅游攻略查询.游记分享.私人定制4大模块,类似携程.同程.去哪儿.马蜂窝移动端,只不过顺便游app界面更为简洁 ...

  5. 亲历H5移动端游戏微信支付接入及那些坑（二）——获取Openid和授权

    第一篇中将一些坑说明,那么这篇开始正式进入接入步骤.具体的参数说明,我不会列出,毕竟微信官方文档都有,我想大家都看的懂,而且这接口也有可能微信会变动,所以不列出来,也是不想引起大家的误解,接入步骤只起 ...

  6. input弹出的手机键盘搜索事件

    一.input的搜索框    在input标签里面把type设置为search就可以了.弹出的手机键盘回车键也会变成搜索或者是搜索的图标. <input id="search" ...

  7. Android 监听软键盘搜索键

    现在很多的Android应用都有了数据搜索功能,在以往的设计上,会使用搜索框+搜索按钮来实现搜索功能: 现在呢,越来越流行的是,去除搜索按钮,直接监听软键盘搜索键,当用户输入完搜索关键字后,直接点击软 ...

  8. H5移动端手势密码组件

    项目简介 最近参加了2017年360前端星计划,完成了一个有趣的UI组件开发大作业,借机和大家分享一下移动端开发的技术啦~~ 本项目采用原生JS和Canvas实现移动端手势密码组件,支持手势密码设置和 ...

  9. 超详细讲解H5移动端适配

    前言 移动互联网发展至今,各种移动设备应运而生,但它们的物理分辨率可以说是五花八门,一般情况UI会为我们提供375尺寸的设计稿,所以为了让H5页面能够在这些不同的设备上尽量表现的一致,前端工程师就不得 ...

随机推荐

  1. Android-显示意图和隐式意图

    显示意图,一般情况下是用于,APP应用自身:组件(Activity,Service,...) 与 组件(Activity,Service,...) 的激活调用: 显示意图,是可以看得到,明确激活哪一个 ...

  2. vector容器(一)

    一. Vector简要描述 vector是C++标准模版库STL提出的一种顺序存储结构,之所以称之为“容器”,是因为vector是一个模板类,它允许我们重复利用已有的实现构造自己的特定类型下的数据结构 ...

  3. Replication--Alwayson+复制发布

    场景:主服务器:RepServer1从服务器:RepServer2监听者:RepListener分发库:DisServer发布数据库:RepDB1配置:1>设置DisServer为分发服务器,在 ...

  4. leetcode 存在重复元素

    给定一个整数数组,判断是否存在重复元素. 如果任何值在数组中出现至少两次,函数返回 true.如果数组中每个元素都不相同,则返回 false. 示例 1: 输入: [1,2,3,1] 输出: true ...

  5. 使用PowerShell自动部署ASP.NetCore程序到IIS

    Windows PowerShell 是一种命令行外壳程序和脚本环境,使命令行用户和脚本编写者可以利用 .NET Framework的强大功能.有关于更多PowerShell的信息,可参阅百度词条 接 ...

  6. python list的append（）和extend（）方法

    引用自:https://www.cnblogs.com/subic/p/6553187.html

  7. HDU6333-2018ACM暑假多校联合训练1002-Harvest of Apples-莫队+费马小定理

    题意很简单啦,求S(n,m)的值 通过打表我们可以知道 S(n + 1, m) = S(n, m) * 2 - C(n, m); S(n - 1, m) = (S(n, m) + C(n - 1, m ...

  8. Android来电、去电监听

    Android手机中添加手机来电的状态,使用PhoneStateListener来监听. TelephonyManager telephonyManager = (TelephonyManager) ...

  9. nginx高性能WEB服务器系列之六--nginx负载均衡配置+健康检查

    nginx系列友情链接:nginx高性能WEB服务器系列之一简介及安装https://www.cnblogs.com/maxtgood/p/9597596.htmlnginx高性能WEB服务器系列之二 ...

  10. 运算符重载入门demo

    #include "pch.h" #include <iostream> using namespace std; class A { public: A(int x, ...