app中经常会有搜索的页面。

大概逻辑是，一般来说首页有一个搜索的图，点击之后跳转到一个搜索的页面，在这个页面做搜索。

正常代码逻辑

<body>

    <a class="button" tapmode="active" onclick="open_s()">打开搜索页面</a>

    <a class="button" tapmode="active" onclick="close_s()">关闭搜索页面</a>

    <a class="button" tapmode="active" onclick="setText_s()">设置搜索框的文字</a>

    <a class="button" tapmode="active" onclick="clearHistory_s()">清空当前搜索历史记录</a>

</body>

<script type="text/javascript" src="../script/api.js"></script>

<script type="text/javascript">

    apiready = function() {

        api.addEventListener({

            name : 'shake'

        }, function(ret, err) {

            console.log();

            close_s()

        });

    };

    function open_s() {

        var UISearchBar = api.require('UISearchBar');

        UISearchBar.open({

            placeholder: '请输入搜索关键字',

            historyCount: ,

            showRecordBtn: true,

            texts: {

                cancelText: '取消',

                clearText: '清除搜索记录'

            },

            styles: {

                navBar: {

                    bgColor: '#FFFFFF',

                    borderColor: '#ccc'

                },

                searchBox: {

                    bgImg: '',

                    color: '#000',

                    height:

                },

                cancel: {

                    bg: 'rgba(0,0,0,0)',

                    color: '#D2691E',

                    size:

                },

                list: {

                    color: '#696969',

                    bgColor: '#FFFFFF',

                    borderColor: '#eee',

                    size:

                },

                clear: {

                    color: '#000000',

                    borderColor: '#ccc',

                    size:

                }

            }

        }, function(ret, err) {

            if (ret) {

                alert(JSON.stringify(ret));

            } else {

                alert(JSON.stringify(err));

            }

        });

    }

    function close_s() {

        var UISearchBar = api.require('UISearchBar');

        UISearchBar.close();

    }

    function setText_s() {

        var UISearchBar = api.require('UISearchBar');

        UISearchBar.setText({

            text: '设置语音识别的文本'

        });

    }

    function clearHistory_s() {

        var UISearchBar = api.require('UISearchBar');

        UISearchBar.clearHistory();

    }

</script>

apicloud UISearchBar 使用方法的更多相关文章

  1. apicloud常用分享方法

    app中经常会有分享的功能,不管是分享商品还是文字还是图片或者是发送给微信好友扣扣好友,一下做一总结. 分享的样式(分享所有的样式模块):MNActionButton. 在apicloud 中添加这个 ...

  2. iOS开发UI篇 -- UISearchBar 属性、方法详解及应用（自定义搜索框样式）

    很多APP都会涉及到搜索框,苹果也为我们提供了默认的搜索框UISearchBar.但实际项目中我们通常需要更改系统默认搜索框的样式.为了实现这一目标,我们需要先搞懂 UISearchBar 的属性及方 ...

  3. 快捷搜索框（UISearchBar）简单实现 swift

    1.在故事板里面拖入一个搜索栏和一个的tableView.2.创建的ViewController,实现代理:UISearchBarDelegate,UITableViewDataSource,的UIT ...

  4. 美团HD(5)-选择城市

    DJSelectCityViewController.m #import "DJSelectCityViewController.h" #import "DJConsta ...

  5. 在navigationItem中添加搜索栏

    给navigationItem中添加个搜索栏,效果和大部分程序一样.代码如下: UISearchBar *searchBar = [[UISearchBaralloc] initWithFrame:C ...

  6. 美团HD(7)-添加取消搜索按钮

    DJSelectCityViewController.m #pragma mark - UISearchBar 代理方法 /** SearchBar开始编辑 */ - (void)searchBarT ...

  7. img标签过滤加fs模块实现图片文件缓存

    方法一:function iCache(selector) { selector.each(function(data) { //msg(data); ! function(data) { var u ...

  8. javaSE27天复习总结

    JAVA学习总结    2 第一天    2 1:计算机概述(了解)    2 (1)计算机    2 (2)计算机硬件    2 (3)计算机软件    2 (4)软件开发(理解)    2 (5) ...

  9. Apicloud学习第三天——获取云数据库的数据方法

    apicloud学习30天中的对用进行注册和登录以及数据的获取的代码,在apicloud中有单独的api对用户的增删查改进行操作,这里写下增加和查询. 增加用户数据 var model=api.req ...

随机推荐

  1. 暑假集训D16总结

    考试 日常爆炸= = T1 一看就是个树规,然而不会写方程= = T2 一看就是个分块,然而不会分= = T3 终于有点头绪,推了两个小时的30分部分分情况,然后打挂了= = 我玩个鬼啊 其实听完,觉 ...

  2. BZOJ——T 1801: [Ahoi2009]chess 中国象棋

    http://www.lydsy.com/JudgeOnline/problem.php?id=1801 Time Limit: 10 Sec  Memory Limit: 64 MBSubmit:  ...

  3. Hibernate注解开发教程

    目录 第一章 类级别注解 1-1 本章简介 一.Hibernate注解简介 二.JPA与Hibernate的关系 三.Hibernate注解的分类 1-2 准备工作 1-3 @Entity注解 1-4 ...

  4. 洛谷 P1041 传染病控制

    P1041 传染病控制 题目背景 近来,一种新的传染病肆虐全球.蓬莱国也发现了零星感染者,为防止该病在蓬莱国大范围流行,该国政府决定不惜一切代价控制传染病的蔓延.不幸的是,由于人们尚未完全认识这种传染 ...

  5. [MongoDB]Python 操作 MongoDB

    from pymongo import MongoClient mc = MongoClient('localhost',27017) db = mc.users db.users.save({'na ...

  6. Clojure：读取xml

    在Clojure中读取XML是很容易的.比如我们有一个名叫strings.xml文件: <?xml version="1.0" encoding="utf-8&qu ...

  7. StringIndexOutOfBoundsException

    <span style="font-family:Microsoft YaHei;font-size:14px;">public class StringIndexBo ...

  8. 使用Memcached改进Java企业级应用性能：架构和设置

    Memcached由Danga Interactive开发.用来提升LiveJournal.com站点性能. Memcached分布式架构支持众多的社交网络应用,Twitter.Facebook还有W ...

  9. MySQL 日期时间函数大全 （转）

    转载自:http://blog.itpub.net/29773961/viewspace-1808967 以下内容基于MySQL 5.6及更高,大部分函数5.5也基本适用,更低版本请参考对应版本手册, ...

  10. linux下dd命令详解【转】

    本文转载自:http://www.cnblogs.com/licheng/articles/1116492.html  名称: dd 使用权限: 所有使用者dd 这个指令在 manual 里的定义是 ...