serach-index.html 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8"/>
  5. <meta name="format-detection" content="telephone=no"/>
  6. <meta name="viewport"
  7. content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
  8. <meta name="apple-mobile-web-app-capable" content="yes"/>
  9. <meta name="apple-mobile-web-app-status-bar-style" content="black"/>
  10. <title>食物热量查询</title>
  11. <link rel="stylesheet" href="../../../css/cross.css" type="text/css"/>
  12. <link rel="stylesheet" href="../css/search-bar.css" type="text/css"/>
  13. </head>
  14. <body>
  15. <div class="searchbar searchbar-init index9999">
  16. <div class="searchbar-input">
  17. <input type="search" placeholder="搜索" id="searchInput">
  18. <a href="javascript:void(0);" class="searchbar-clear"></a>
  19. <a class="searchbar-cancel" id="searchCancel"><img src="../images/guanbi_btn.png" width="18" height="18"></a>
  20. </div>
  21. </div>
  22. <!--查询结果列表-->
  23. <ul class="searchbar-result-list index9999 js-mask-cont" id="searchResultList">
  24. <script id="ResultTemplate" type="text/html">
  25. {{each list as value i}}
  26. <li class="searchbar-result-item" data-id="{{value.id}}">
  27. <span class="searchbar-result-name">{{value.name}}</span>
  28. </li>
  29. {{/each}}
  30. </script>
  31. </ul>
  32. <div class="common-mask js-mask-cont"></div>
  33. <!-- 分类入口 -->
  34. <div class="search-list-box" id="categoryIndex">
  35. <script id="categoryList" type="text/html">
  36. {{each list as value i}}
  37. <div class="search-list-item">
  38. <a href="category-cont.html?pid={{value.id}}" class="search-list-item-img"><img src="{{value.photo | getPhoto}}" alt=""></a>
  39. <div class="search-list-item-txt">{{value.name}}</div>
  40. </div>
  41. {{/each}}
  42. </script>
  43. </div>
  44. <div class="search-result" id="searchResult">
  45. <script id="singleResult" type="text/html">
  46. <div class="search-result-main">
  47. <div class="search-main-box">
  48. <div class="search-result-img">
  49. <img src="{{photo | getPhoto}}" alt="">
  50. </div>
  51. <div class="search-result-tit">
  52. <div class="line1"><span>{{name}}</span><span class="pl30">{{weight}}</span></div>
  53. <div class="line2">{{hot}}千卡热量</div>
  54. </div>
  55. </div>
  56. </div>
  57. <div class="search-result-msg mt10">
  58. <div class="c-border-b pb10 pt10 pl10">营养信息</div>
  59. <ul class="search-result-msg-list">
  60. {{each component as value i}}
  61. <li><span>{{i}}</span><span>{{value}}</span></li>
  62. {{/each}}
  63. </ul>
  64. </div>
  65. </script>
  66. </div>
  67. <script type="text/javascript" src="../../../js/jquery/2.1.3/jquery.js"></script>
  68. <script src="../../../js/weixin_common.js"></script>
  69. <script src="../../../js/template.js"></script>
  70. <script src="../../../js/common_http.js" type="text/javascript" charset="utf-8"></script>
  71. <script src="../js/search-bar.js"></script>
  72. <script type="text/javascript">
  73. template.helper('getPhoto', function(str){
  74. return getImgUrl(str);
  75. })
  76. </script>
  77. </body>
  78. </html>