使用JS轻松实现ionic调用键盘搜索功能(超实用)


Posted in Javascript onSeptember 06, 2016

这个需求是产品提的,一开始只是设置了 <input style="padding-top: 3px;" type="search" placeholder="搜索医生或医院" ng-model="query">

type="search"

发现android上可以ios调取不出search健来,气死我了,经过google的搜索得到结论,需要在外面套用一个form表单,于是加上果然好使而且结合了form表单提交的事件直接调用了button 按钮的点击事件ng-click="searchSelect()",不需要额外再去监听搜索键盘点击事件,省了一大堆的麻烦,果然很实用啊,我真是个天才

hml代码如下:

<form>
<div class="bar bar-header item-input-inset" style="height: 50px;">
<label class="item-input-wrapper" id="search-input">
<i class="icon ion-ios-search" style="position: relative;color: gray;font-size: 1.5em;top: 1px;"></i>
<input style="padding-top: 3px;" type="search" placeholder="搜索医生或医院" ng-model="query">
</label>
<button class="button button-clear" style="color: #49B746;" ng-click="searchSelect()">搜索</button>
</div>
</form>

js代码如下:

$scope.searchSelect = function(){
if ($scope.currentSearchType == 'hospital'){
}else{
$scope.search();
}
};

以上所述是小编给大家介绍的使用JS轻松实现ionic调用键盘搜索功能(超实用),希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
新页面打开实际尺寸的图片
Aug 25 Javascript
借用Google的Javascript API Loader来加速你的网站
Jan 28 Javascript
js下通过getList函数实现分页效果的代码
Sep 17 Javascript
JQuery页面的表格数据的增加与分页的实现
Dec 10 Javascript
让JavaScript中setTimeout支持链式操作的方法
Jun 19 Javascript
Node.js静态文件服务器改进版
Jan 10 Javascript
在Linux系统中搭建Node.js开发环境的简单步骤讲解
Jan 26 Javascript
JavaScript实现移动端滑动选择日期功能
Jun 21 Javascript
理解 javascript 中的函数表达式与函数声明
Jul 07 Javascript
vue input输入框模糊查询的示例代码
May 22 Javascript
微信小程序如何通过用户授权获取手机号(getPhoneNumber)
Jan 21 Javascript
js实现跳一跳小游戏
Jul 31 Javascript
使用JS实现图片展示瀑布流效果(简单实例)
Sep 06 #Javascript
ion content 滚动到底部会遮住一部分视图的快速解决方法
Sep 06 #Javascript
原生JS:Date对象全面解析
Sep 06 #Javascript
如何解决IONIC页面底部被遮住无法向上滚动问题
Sep 06 #Javascript
Vue.js每天必学之过渡与动画
Sep 06 #Javascript
Vue.js 父子组件通讯开发实例
Sep 06 #Javascript
Vuejs第十篇之vuejs父子组件通信
Sep 06 #Javascript
You might like
1982年日本摄影师镜头下的中国孩子 那无忧无虑的童年
2020/03/12 杂记
弄了个检测传输的参数是否为数字的Function
2006/12/06 PHP
php写的简易聊天室代码
2011/06/04 PHP
PHP实现检测客户端是否使用代理服务器及其匿名级别
2015/01/07 PHP
Codeigniter的dom类用法实例
2015/06/26 PHP
如何通过Apache在本地配置多个虚拟主机
2020/07/29 PHP
显示js对象所有属性和方法的函数
2009/10/16 Javascript
JavaScript Cookie显示用户上次访问的时间和次数
2009/12/08 Javascript
JS格式化数字金额用逗号隔开保留两位小数
2013/10/18 Javascript
JS随机漂浮广告代码具体实例
2013/11/19 Javascript
JS图片无缝、平滑滚动代码
2014/03/11 Javascript
js检测输入内容全为空格的方法
2014/05/03 Javascript
网站基于flash实现的Banner图切换效果代码
2014/10/14 Javascript
JavaScript实现鼠标滑过图片变换效果的方法
2015/04/16 Javascript
详解js实现线段交点的三种算法
2016/08/09 Javascript
JS作用域链详解
2017/06/26 Javascript
vue几个常用跨域处理方式介绍
2018/02/07 Javascript
结合Vue控制字符和字节的显示个数的示例
2018/05/17 Javascript
JS sort方法基于数组对象属性值排序
2020/07/10 Javascript
H5 js点击按钮复制文本到粘贴板
2020/11/19 Javascript
vue实现轮播图帧率播放
2021/01/26 Vue.js
轻量级的Web框架Flask 中模块化应用的实现
2017/09/11 Python
python实现二维插值的三维显示
2018/12/17 Python
如何使用selenium和requests组合实现登录页面
2020/02/03 Python
Python 实现二叉查找树的示例代码
2020/12/21 Python
解决selenium+Headless Chrome实现不弹出浏览器自动化登录的问题
2021/01/09 Python
舞会礼服和舞会鞋:PromGirl
2019/04/22 全球购物
酒店门卫岗位职责
2013/12/29 职场文书
宿舍使用违章电器检讨书
2014/01/12 职场文书
英文演讲稿开场白
2014/08/25 职场文书
学风建设演讲稿
2014/09/12 职场文书
2014年变电站工作总结
2014/12/19 职场文书
幽灵公主观后感
2015/06/09 职场文书
用Python制作灯光秀短视频的思路详解
2021/04/13 Python
Go语言带缓冲的通道实现
2021/04/26 Golang
Python编程中Python与GIL互斥锁关系作用分析
2021/09/15 Python