一:调出系统带回车键的键盘
在项目中经常有输入框,当输入完成后点击确定执行相应的动作。但是有些设计没有确定或者搜索按钮,这就需要调用系统键盘,点击系统键盘的确定后执行相应动作。
但是单纯的input是无法实现的,要想调出带回车的键盘必须把input放在form表单里面才可以,并且得加上action(一定要加),下面是个简单的例子。
<form action class="search" onsubmit="return false;"> <i class="fa fa-lg fa-search"></i> <input type="text" class="search-input" placeholder="搜索"> <i class="fa fa-lg fa-times-circle clear-search"></i> </form>
这里为了避免form提交带来的页面刷新加了个onsubmit="return false;"。
二:取消后隐藏系统键盘
在PC上想取消光标,可以直接点击页面的其他任何部分,但是在手机上点击其他无绑定事件的部分是没法取消光标的。这里提供三个方法来
隐藏键盘,在项目上选择其中最简单的一个就可以。
1. 最简单的的一个,直接 <a href="javascript:" class="search-close">取消</a>,点一下就可以了。
2. 用js或者jq直接让输入框失去焦点就可以,这里需要绑定主动失焦事件了。
3. 设置个非a标签的标签,随便绑定个点击事件就可以,哪怕方法里面什么都不写。
时间: 2024-10-11 14:43:37