search

实例 --- ```html <header class="header box flex"> <div class="flex0 plr12 relative"><i class="phoenix_icon phoenix_icon_left"></i><page></page></div> <div class="flex1 relative"> <div class="absolute left0 top0 i18 plr12 color_gray3"><i class="phoenix_icon phoenix_icon_search"></i></div> <div class="plr5"> <input type="text" placeholder="请输入搜索关键字搜索" class="mt5 bg_gray1 plr10 lh32 radius4 searchInput" style="padding-left:30px;width:100%;"> </div> <div class="absolute right0 top0" style="right:4px;"> <div class="relative plr12 i18 color_gray3 hide searchDel"> <div class="link"></div> <i class="phoenix_icon phoenix_icon_close-circle"></i> </div> </div> </div> <div class="flex0 plr12 relative"><div class="link searchBtn"></div>搜索</div> </header> <div class="content"> <div class="searchHistory"></div> <div class="hide searchResult"> <div class="touch_wrapper"></div> </div> </div> ``` ```javascript // 获取本地搜索记录 var searchArray; if("undefined" != typeof plus) { if(plus.storage.getItem('phoenixSearchHistory') === null) {// 没有《历史搜索》 searchArray= []; } else { searchArray= JSON.parse( plus.storage.getItem('phoenixSearchHistory') ); }; } else { searchArray= []; }; // 实例化搜索插件 new phoenix.search({ searchInput: page.querySelector('.searchInput'),// 必需,搜索输入框 searchInputDel: page.querySelector('.searchDel'),// 必需,输入框内的删除图标 searchBtn: page.querySelector('.searchBtn'),// 必需,搜索按钮 searchContent: page.querySelector('.searchHistory'),// 必需,历史搜索关键词显示区 searchList: searchArray,// 必需,搜索历史记录 searchResult:page.querySelector('.searchResult'),// 必需,搜索结果显示区 loadResult: function (searchKey) {// 必需,搜索回调 // 回调函数,searchKey值为输入搜索的关键字 }, editHistory: function (searchArray) {// 必需,回调函数,修改本地历史搜索,不用修改 if("undefined" != typeof plus) { if(searchArray.length > 0) { plus.storage.setItem("phoenixSearchHistory",JSON.stringify(searchArray)); } else { plus.storage.removeItem("phoenixSearchHistory"); }; } }, }); ``` 配置项 --- |属性|类型|默认值|说明| |-|-|-|-|