123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203 |
- <!doctype html>
- <html>
- <head>
- <meta charset="UTF-8">
- <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
- <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
- <meta name="format-detection"content="telephone=no">
- <title>index</title>
- <link rel="stylesheet" type="text/css" href="../../css/api.css"/>
- <link rel="stylesheet" href="../../css/projeck.css">
- <style media="screen">
- body,html{
- margin: 0;
- background: #fff;
- }
- .aui-searchbar{
- width: 86%;
- height: 50px;
- margin-left: 40px;
- background-color: transparent;
- }
- .aui-searchbar .aui-searchbar-btn{
- color: #fff;
- }
- .aui-searchbar-input{
- background: #fff;
- }
- .aui-searchbar-input input{
- color: #000;
- }
- #search-input::placeholder{
- color: #ccc;
- font-size: 14px;
- }
- .search_ico{
- width: 16px;
- height: 16px;
- display: block;
- position: absolute;
- background: url("../../image/search.png") no-repeat;
- background-size: cover;
- top: 8px;
- left: 17px;
- }
- .backBtn{
- margin-left: 5px;
- }
- #search-input{
- font-size: 14px;
- height: 28px;
- }
- .aui-searchbar-input{
- margin-right: 60px;
- }
- .search_btn{
- position: absolute;
- bottom: 9px;
- right: 10px;
- width: 54px;
- height: 31px;
- line-height: 31px;
- -webkit-border-radius: 50px;
- -moz-border-radius: 50px;
- border-radius: 50px;
- color: #000;
- background: #fff;
- font-size: 13px;
- }
- nav{
- background: #009fe8;
- position: relative;
- }
- .row{
- padding: 0 30px 24px 30px;
- }
- .row li{
- padding: 5px;
- color: #72e5ff;
- font-size: 16px;
- position: relative;
- }
- .row li.selectIndex{
- color: #fff;
- }
- .row li.selectIndex:after{
- content: '';
- position: absolute;
- bottom: 0;
- left: 0;
- width: 100%;
- height: 2px;
- background: #fff;
- }
- .radius_top{
- width: 100%;
- height: 10px;
- background: #fff;
- border-top-left-radius: 10px;
- border-top-right-radius: 10px;
- -webkit-border-top-left-radius: 10px;
- -webkit-border-top-right-radius: 10px;
- position: absolute;
- bottom: 0;
- left: 0;
- }
- </style>
- </head>
- <body>
- <div class="api_layout">
- <header class="header-login">
- <img class="backBtn" src="../../image/btn_back.png" alt="" onclick="backIndex()">
- <div class="aui-searchbar" id="search">
- <div class="aui-searchbar-input aui-border-radius">
- <i class="search_ico"></i>
- <form>
- <input type="search" placeholder="搜索" id="search-input">
- </form>
- </div>
- <span class="search_btn" onclick="seacrhWinFun(inputValue)">搜索</span>
- </div>
- </header>
- </div>
- </body>
- </html>
- <script type="text/javascript" src="../../script/api.js"></script>
- <!-- <script src="../../script/fastclick.min.js" charset="utf-8"></script> -->
- <script type="text/javascript" src="../../script/config.js"></script>
- <script type="text/javascript">
- var inputValue = ''
- apiready = function () {
- $api.fixStatusBar($api.dom('header') );
- // api.parseTapmode();
- // var info = $api.getStorage('data'),
- // token = JSON.parse(info).data.access_token;
- fnInitUIInput();
- funIniGroup();
- };
- var eHeaderLis,index = 0;
- function funIniGroup(){
- $event.openFrame('searchFrame','header','','','')
- };
- function backIndex() {
- api.closeWin();
- }
- // input
- function fnInitUIInput() {
- var searchText = $api.byId('search-input');
- var rect = $api.offset(searchText);
- var UIInput = api.require('UIInput');
- UIInput.open({
- rect: {
- x: rect.l,
- y: rect.t+1,
- w: rect.w,
- h: rect.h-1
- },
- styles: {
- bgColor: '#fff',
- size: 14,
- color: '#000',
- placeholder: {
- color: '#ccc'
- }
- },
- autoFocus: false,
- maxRows: 1,
- placeholder: '搜索',
- keyboardType: 'default',
- fixedOn: api.frameName
- }, function(ret, err) {
- if (ret) {
- var uiInputId = ret.id;
- if (ret && ret.eventType == "show") {
- setTimeout(function() {
- UIInput.popupKeyboard({id: uiInputId});
- }, 300)
- } else if (ret.eventType == "change") {
- UIInput.value({
- id: uiInputId
- }, function(ret, err) {
- if (ret) {
- if (ret.status) {
- inputValue = ret.msg;
- seacrhWinFun(ret.msg);
- }
- }
- });
- }
- }
- });
- }
- // 查询
- function seacrhWinFun(text) {
- var pageNum = 1;
- api.execScript({
- name: 'searchWin',
- frameName: 'searchFrame',
- script: 'searchData("'+text+'","'+pageNum+'");'
- });
- }
- </script>
|