fe / YOHO-ACTIVITY-PHP · Commits

Go to a project

Authored by ccbikai
Commit a5188e3d21bbf8c5a9022b7479cdfdb6c3eaa17c 1 parent 24472a4c

搜索框优化

Inline Side-by-side
Showing 6 changed files with 19 additions and 6 deletions
@@ -46,6 +46,11 @@ cHammer.on('tap', function() { @@ -46,6 +46,11 @@ cHammer.on('tap', function() {
46 $input.val('').trigger('input'); 46 $input.val('').trigger('input');
47 }); 47 });
48 48
  49 +$('#search').on('touchend', function() {
  50 + $(this).closest('form').submit();
  51 + return false;
  52 +});
  53 +
49 //初始化历史搜索的内容 54 //初始化历史搜索的内容
50 (function() { 55 (function() {
51 var html = '', 56 var html = '',
@@ -69,6 +69,13 @@ var $listNav = $('#list-nav'), @@ -69,6 +69,13 @@ var $listNav = $('#list-nav'),
69 btnIntroHammer, 69 btnIntroHammer,
70 introHammer, 70 introHammer,
71 brandColHammer; 71 brandColHammer;
  72 +/**
  73 + * 手动触发搜索
  74 + */
  75 +$('#search').on('touchend', function() {
  76 + $(this).closest('form').submit();
  77 + return false;
  78 +});
72 79
73 /** 80 /**
74 * 筛选注册的回调，筛选子项点击后逻辑 81 * 筛选注册的回调，筛选子项点击后逻辑
@@ -35,10 +35,10 @@ @@ -35,10 +35,10 @@
35 .search { 35 .search {
36 position: absolute; 36 position: absolute;
37 top: 18rem / $pxConvertRem; 37 top: 18rem / $pxConvertRem;
38 - left: 515rem / $pxConvertRem; 38 + right: 40rem / $pxConvertRem;
39 border: none; 39 border: none;
40 background: transparent; 40 background: transparent;
41 - color: #000; 41 + color: #666;
42 font-size: 30rem / $pxConvertRem; 42 font-size: 30rem / $pxConvertRem;
43 line-height: 56rem / $pxConvertRem; 43 line-height: 56rem / $pxConvertRem;
44 } 44 }
@@ -32,8 +32,8 @@ @@ -32,8 +32,8 @@
32 32
33 .search { 33 .search {
34 position: absolute; 34 position: absolute;
35 - top: 7px;  
36 - right:0; 35 + top: 2px;
  36 + right: -30px;
37 border: none; 37 border: none;
38 background: transparent; 38 background: transparent;
39 font-size: 16px; 39 font-size: 16px;
@@ -41,6 +41,7 @@ @@ -41,6 +41,7 @@
41 height: 30px; 41 height: 30px;
42 overflow: hidden; 42 overflow: hidden;
43 line-height: 30px; 43 line-height: 30px;
  44 + color: #666;
44 } 45 }
45 } 46 }
46 47
@@ -6,7 +6,7 @@ @@ -6,7 +6,7 @@
6 <i class="search-icon iconfont">&#xe60f;</i> 6 <i class="search-icon iconfont">&#xe60f;</i>
7 <input type="text" placeholder="搜索商品" name="query"> 7 <input type="text" placeholder="搜索商品" name="query">
8 <i class="clear-input iconfont hide">&#xe626;</i> 8 <i class="clear-input iconfont hide">&#xe626;</i>
9 - <button id="search" class="search" type="submit">搜索</button> 9 + <span id="search" class="search" type="submit">搜索</span>
10 </form> 10 </form>
11 </div> 11 </div>
12 <div class="search-items"> 12 <div class="search-items">
@@ -6,7 +6,7 @@ @@ -6,7 +6,7 @@
6 <input type="text" value="{{default}}" name="query"> 6 <input type="text" value="{{default}}" name="query">
7 <input type="hidden" value="search" name="search"> 7 <input type="hidden" value="search" name="search">
8 <i class="clear-input iconfont hide">&#xe61a;</i> 8 <i class="clear-input iconfont hide">&#xe61a;</i>
9 - <button id="search" class="search" type="submit">搜索</button> 9 + <span id="search" class="search" type="submit">搜索</span>
10 </form> 10 </form>
11 </div> 11 </div>
12 {{/ search}} 12 {{/ search}}