From 6c5e6f82218e2f6c632511a156e4c890bd06b4af Mon Sep 17 00:00:00 2001
From: vitamin <934436407@qq.com>
Date: Mon, 13 May 2019 17:06:51 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E9=94=AE=E7=9B=98=E4=B8=8A?=
=?UTF-8?q?=E4=B8=8B=E7=A7=BB=E5=8A=A8=E9=80=89=E6=8B=A9=E5=80=99=E9=80=89?=
=?UTF-8?q?=E8=AF=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
static/css/style.css | 595 ++++++++++++++++++++++---------------------
static/js/keyword.js | 476 ++++++++++++++++++----------------
2 files changed, 560 insertions(+), 511 deletions(-)
diff --git a/static/css/style.css b/static/css/style.css
index d2c6b9b..5bd9563 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -1,296 +1,299 @@
-/* ================ reset 样式 start ================ */
-* {
- margin: 0;
- padding: 0;
- font-family: "微软雅黑";
- -webkit-box-sizing: border-box;
- -moz-box-sizing: border-box;
- box-sizing: border-box;
-}
-body, ul, li, h1, h2, h3, h4, h5, h6, p, form, dl, dt, dd {
- margin: 0px;
- padding: 0px;
- font-size: 14px;
- font-weight: normal;
-}
-img {
- border-style: none;
-}
-li {
- list-style: none;
-}
-a {
- text-decoration: none
-}
-html, body {
- background: #fff;
- height: 100%;
-
-}
-
-
-input[type="button"], input[type="submit"], input[type="reset"] {
- -webkit-appearance: none;
- outline: 0;
-}
-
-textarea {
- -webkit-appearance: none;
-}
-
-/* ================ reset 样式 end ================ */
-
-
-.inner-center {
- width: 1000px;
- margin: 0 auto;
-
-}
-
-.main {
- padding-top: 5%;
- min-height: 100%;
-
-}
-.content-inside{
- padding-bottom: 60px;
-}
-.footer {
- height: 60px;
- text-align: center;
- margin-top: -60px;
- /* position: relative;
- margin-top: -100px;
- clear:both; */
-}
-/* logo start */
-.logo-box {
- display: flex;
- overflow: hidden;
- margin-left: 250px;
- align-items: center;
-}
-.logo-left {
- position: relative;
- width: 125px;
- height: 121px;
- cursor: pointer;
-}
-.logo-right {
- padding-left: 36px;
- font-size: 36px;
- color: rgba(0, 39, 102, 1);
- font-family: SourceHanSansSC-regular;
-}
-/* logo end */
-
-
-/* 搜索框 start */
-.search-section {
- margin-top: 14px;
- margin-bottom: 40px;
-}
-.search-section {
- position: relative;
- display: flex;
-}
-.search-left {
- display: flex;
- width: 877px;
- height: 54px;
- line-height: 20px;
- border: 1px solid rgba(217, 217, 217, 0.96);
-}
-.search-logo {
- width: 40px;
- align-items: center;
- justify-content: center;
- background: url("./img/scgoogle.png") center center no-repeat;
- filter: grayscale(100%);
- -webkit-filter: grayscale(100%);
- -moz-filter: grayscale(100%);
- -o-filter: grayscale(100%);
- filter: alpha(opacity=20);
- -moz-opacity: 0.2;
- -khtml-opacity: 0.2;
- opacity: 0.2;
- cursor: pointer;
-}
-.search-logo:hover {
- filter: grayscale(0%);
- -webkit-filter: grayscale(0%);
- -moz-filter: grayscale(0%);
- -o-filter: grayscale(0%);
- filter: alpha(opacity=100);
- -moz-opacity: 1;
- -khtml-opacity: 1;
- opacity: 1;
-}
-.search-methods {
- display: none;
- position: absolute;
- left: 0;
- top: 54px;
- width: 155px;
- border: 1px solid rgba(217, 217, 217, 0.96);
- background-color: #fff;
-}
-.search-methods li {
- padding-left: 39px;
- background: url("./img/scgoogle.png") 10px no-repeat;
- overflow: hidden;
- height: 34px;
- line-height: 34px;
- color: #545454;
- cursor: pointer;
-}
-.search-logo.baidu, li.baidu {
- background-image: url("./img/scbaidu.png");
-}
-.search-logo.bing, li.bing {
- background-image: url("./img/scbing.png");
-}
-.search-logo.sogou, li.sogou {
- background-image: url("./img/scsogou.png");
-}
-.search-logo.wangpan, li.wangpan {
- background-image: url("./img/scwangpan.png");
-}
-.search-logo.so, li.so {
- background-image: url("./img/scso.png");
-}
-.search-logo.google, li.google {
- background-image: url("./img/scgoogle.png");
-}
-
-.search-methods .search-item:hover {
- background-color: #f0f0f0;
-}
-
-.search-result {
- display: none;
- position: absolute;
- width: 837px;
- top: 55px;
- left: 40px;
- border: 1px solid rgba(187, 187, 187, 1);
- background-color: #fff;
-}
-.result-item {
- height: 34px;
- line-height: 34px;
- padding-left: 15px;
-}
-.result-item:hover {
- background-color: #eee;
- cursor: pointer;
-}
-
-.input-wrap {
- position: relative;
- flex: 1;
-}
-.input-wrap .search-input {
- height: 52px;
- width: 100%;
- outline: 0;
- border: 0;
- font-size: 16px;
- padding-left: 15px;
-}
-/* .input-wrap .search-input:focus{
- border-style:solid;
- border-color: #FDA31E 96%;
- box-shadow: 0 0 10px #FDA31E;
- } */
-/* .search-left:focus{
- border-style:solid;
- border-color: #FDA31E 96%;
- box-shadow: 0 0 10px #FDA31E;
- } */
-.input-wrap .clear-keyword {
- display: none;
- position: absolute;
- top: 50%;
- right: 10px;
- transform: translateY(-50%);
- cursor: pointer;
- color: #d2d2d2;
- font-size: 30px;
-}
-
-.search-submit {
- width: 123px;
- height: 54px;
- line-height: 26px;
- background: url("./img/search.png") #1890ff 48px center no-repeat;
- -webkit-background-size: 35px 35px;
- background-size: 35px 35px;
- color: #fff;
- font-size: 18px;
- text-align: center;
- font-family: Roboto;
- border: 1px solid #1890ff;
- cursor: pointer;
-}
-
-/* 搜索框 end */
-/* 导航内容 start */
-.nav-content {
- overflow: hidden;
-}
-/* 导航内容 end */
-
-
-/*内容区域*/
-
-/*-----------------------------简洁版样式定义- 开始---------------------------------------------------*/
-
-.jj-list {
- width: 33.33%;
- float: left;
- margin-bottom: 30px;
- padding-right: 16px;
-}
-.jj-list:nth-of-type(3n) {
- padding-right: 0;
-}
-.jj-list-tit {
- font-size: 16px;
- line-height: 25px;
- color: rgba(49, 70, 89, 1);
- font-weight: bold;
-}
-.jj-list-con {
- overflow: hidden;
- margin: 0 auto;
-
-}
-.jj-list-con li {
- box-sizing: border-box; /*以IE盒子模型的width为标准*/
- padding: 1px 1px; /*设置div的内边距*/
- width: 33.33%; /*div等分成4部分*/
- float: left;
-}
-
-
-.jj-list-link {
- display: block;
- background: rgba(230, 247, 255, 0.96);
- color:rgba(49, 70, 89, 1);
- font-size: 13px;
- text-align: center;
- line-height: 44px;
- transition: all 0.2s;
- border-radius: 2px;
-}
-.jj-list-link:hover {
- background: #1890FF 100%;
- font-size: 18px;
- font-weight: bold;
- color: #fff;
-}
-
-/*-----------------------------简洁版样式定义- 结束---------------------------------------------------*/
-
-
+/* ================ reset 样式 start ================ */
+* {
+ margin: 0;
+ padding: 0;
+ font-family: "微软雅黑";
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+}
+body, ul, li, h1, h2, h3, h4, h5, h6, p, form, dl, dt, dd {
+ margin: 0px;
+ padding: 0px;
+ font-size: 14px;
+ font-weight: normal;
+}
+img {
+ border-style: none;
+}
+li {
+ list-style: none;
+}
+a {
+ text-decoration: none
+}
+html, body {
+ background: #fff;
+ height: 100%;
+
+}
+
+
+input[type="button"], input[type="submit"], input[type="reset"] {
+ -webkit-appearance: none;
+ outline: 0;
+}
+
+textarea {
+ -webkit-appearance: none;
+}
+
+/* ================ reset 样式 end ================ */
+
+
+.inner-center {
+ width: 1000px;
+ margin: 0 auto;
+
+}
+
+.main {
+ padding-top: 5%;
+ min-height: 100%;
+
+}
+.content-inside{
+ padding-bottom: 60px;
+}
+.footer {
+ height: 60px;
+ text-align: center;
+ margin-top: -60px;
+ /* position: relative;
+ margin-top: -100px;
+ clear:both; */
+}
+/* logo start */
+.logo-box {
+ display: flex;
+ overflow: hidden;
+ margin-left: 250px;
+ align-items: center;
+}
+.logo-left {
+ position: relative;
+ width: 125px;
+ height: 121px;
+ cursor: pointer;
+}
+.logo-right {
+ padding-left: 36px;
+ font-size: 36px;
+ color: rgba(0, 39, 102, 1);
+ font-family: SourceHanSansSC-regular;
+}
+/* logo end */
+
+
+/* 搜索框 start */
+.search-section {
+ margin-top: 14px;
+ margin-bottom: 40px;
+}
+.search-section {
+ position: relative;
+ display: flex;
+}
+.search-left {
+ display: flex;
+ width: 877px;
+ height: 54px;
+ line-height: 20px;
+ border: 1px solid rgba(217, 217, 217, 0.96);
+}
+.search-logo {
+ width: 40px;
+ align-items: center;
+ justify-content: center;
+ background: url("./img/scgoogle.png") center center no-repeat;
+ filter: grayscale(100%);
+ -webkit-filter: grayscale(100%);
+ -moz-filter: grayscale(100%);
+ -o-filter: grayscale(100%);
+ filter: alpha(opacity=20);
+ -moz-opacity: 0.2;
+ -khtml-opacity: 0.2;
+ opacity: 0.2;
+ cursor: pointer;
+}
+.search-logo:hover {
+ filter: grayscale(0%);
+ -webkit-filter: grayscale(0%);
+ -moz-filter: grayscale(0%);
+ -o-filter: grayscale(0%);
+ filter: alpha(opacity=100);
+ -moz-opacity: 1;
+ -khtml-opacity: 1;
+ opacity: 1;
+}
+.search-methods {
+ display: none;
+ position: absolute;
+ left: 0;
+ top: 54px;
+ width: 155px;
+ border: 1px solid rgba(217, 217, 217, 0.96);
+ background-color: #fff;
+}
+.search-methods li {
+ padding-left: 39px;
+ background: url("./img/scgoogle.png") 10px no-repeat;
+ overflow: hidden;
+ height: 34px;
+ line-height: 34px;
+ color: #545454;
+ cursor: pointer;
+}
+.search-logo.baidu, li.baidu {
+ background-image: url("./img/scbaidu.png");
+}
+.search-logo.bing, li.bing {
+ background-image: url("./img/scbing.png");
+}
+.search-logo.sogou, li.sogou {
+ background-image: url("./img/scsogou.png");
+}
+.search-logo.wangpan, li.wangpan {
+ background-image: url("./img/scwangpan.png");
+}
+.search-logo.so, li.so {
+ background-image: url("./img/scso.png");
+}
+.search-logo.google, li.google {
+ background-image: url("./img/scgoogle.png");
+}
+
+.search-methods .search-item:hover {
+ background-color: #f0f0f0;
+}
+
+.search-result {
+ display: none;
+ position: absolute;
+ width: 837px;
+ top: 55px;
+ left: 40px;
+ border: 1px solid rgba(187, 187, 187, 1);
+ background-color: #fff;
+}
+.result-item {
+ height: 34px;
+ line-height: 34px;
+ padding-left: 15px;
+}
+.result-item.active {
+ background: #F0F0F0;
+}
+.result-item:hover {
+ background-color: #eee;
+ cursor: pointer;
+}
+
+.input-wrap {
+ position: relative;
+ flex: 1;
+}
+.input-wrap .search-input {
+ height: 52px;
+ width: 100%;
+ outline: 0;
+ border: 0;
+ font-size: 16px;
+ padding-left: 15px;
+}
+/* .input-wrap .search-input:focus{
+ border-style:solid;
+ border-color: #FDA31E 96%;
+ box-shadow: 0 0 10px #FDA31E;
+ } */
+/* .search-left:focus{
+ border-style:solid;
+ border-color: #FDA31E 96%;
+ box-shadow: 0 0 10px #FDA31E;
+ } */
+.input-wrap .clear-keyword {
+ display: none;
+ position: absolute;
+ top: 50%;
+ right: 10px;
+ transform: translateY(-50%);
+ cursor: pointer;
+ color: #d2d2d2;
+ font-size: 30px;
+}
+
+.search-submit {
+ width: 123px;
+ height: 54px;
+ line-height: 26px;
+ background: url("./img/search.png") #1890ff 48px center no-repeat;
+ -webkit-background-size: 35px 35px;
+ background-size: 35px 35px;
+ color: #fff;
+ font-size: 18px;
+ text-align: center;
+ font-family: Roboto;
+ border: 1px solid #1890ff;
+ cursor: pointer;
+}
+
+/* 搜索框 end */
+/* 导航内容 start */
+.nav-content {
+ overflow: hidden;
+}
+/* 导航内容 end */
+
+
+/*内容区域*/
+
+/*-----------------------------简洁版样式定义- 开始---------------------------------------------------*/
+
+.jj-list {
+ width: 33.33%;
+ float: left;
+ margin-bottom: 30px;
+ padding-right: 16px;
+}
+.jj-list:nth-of-type(3n) {
+ padding-right: 0;
+}
+.jj-list-tit {
+ font-size: 16px;
+ line-height: 25px;
+ color: rgba(49, 70, 89, 1);
+ font-weight: bold;
+}
+.jj-list-con {
+ overflow: hidden;
+ margin: 0 auto;
+
+}
+.jj-list-con li {
+ box-sizing: border-box; /*以IE盒子模型的width为标准*/
+ padding: 1px 1px; /*设置div的内边距*/
+ width: 33.33%; /*div等分成4部分*/
+ float: left;
+}
+
+
+.jj-list-link {
+ display: block;
+ background: rgba(230, 247, 255, 0.96);
+ color:rgba(49, 70, 89, 1);
+ font-size: 13px;
+ text-align: center;
+ line-height: 44px;
+ transition: all 0.2s;
+ border-radius: 2px;
+}
+.jj-list-link:hover {
+ background: #1890FF 100%;
+ font-size: 18px;
+ font-weight: bold;
+ color: #fff;
+}
+
+/*-----------------------------简洁版样式定义- 结束---------------------------------------------------*/
+
+
diff --git a/static/js/keyword.js b/static/js/keyword.js
index 9e8224f..c0e6534 100644
--- a/static/js/keyword.js
+++ b/static/js/keyword.js
@@ -1,216 +1,262 @@
-$(function () {
-
- // 默认搜索引擎记录
- var searchTypeStore = {
- set: function (type) {
- localStorage.setItem('SearchType', type);
- },
- get: function () {
- return localStorage.getItem('SearchType');
- },
- };
-
- var $searchMethods = $('#search_methods');
- var $searchLogo = $('#search_logo');
- var initSearchType = searchTypeStore.get();
- $searchLogo.addClass(initSearchType).data('type', initSearchType);
-
- var search_types = [
- { url: 'https://www.baidu.com/s?wd=', type: 'baidu' },
- { url: 'https://www.sogou.com/web?query=', type: 'sogou' },
- { url: 'https://cn.bing.com/search?q=', type: 'bing' },
- { url: 'https://www.so.com/s?q=', type: 'so' },
- { url: 'https://www.google.com/search?q=', type: 'google' },
- { url: 'http://www.cilimao.cc/search?word=', type: 'cili' },
- { url: 'http://neets.cc/search?key=', type: 'yingyin' },
- { url: 'http://www.panduoduo.net/s/name/', type: 'wangpan' },
- ];
- $searchLogo.on('click', function () {
- $searchMethods.show();
- });
-
- // 搜索引擎切换
- $searchMethods.on('click', 'li', function () {
- var type = $(this).data('type');
- searchTypeStore.set(type);
- $searchLogo.removeClass()
- .data('type', type)
- .addClass(type + ' search-logo');
- $searchMethods.hide();
- $('#search_keyword').focus();
- });
- $searchMethods.on('mouseleave', function () {
- $searchMethods.hide();
- });
-
- var EVENT_CLEAR_KEYWORD = 'clearKeyword';
- var EVENT_SEARCH = 'search';
- // 关键词搜索输入
- $('#search_keyword').on('keyup', function (event) {
- var $keyword = $(this);
- var keyword = $keyword.val();
- if(event.which==13){
- openSearch(keyword)
- return;
- }
- // TODO 上下键选择待选答案
- keywordChange(keyword);
- }).on('blur', function () {
- // $('#search_result').hide();
- }).on('focus', function () {
- var keyword = $(this).val();
- keywordChange(keyword);
- });
-
- function keywordChange(keyword) {
- if (keyword === '') {
- $(document).trigger(EVENT_CLEAR_KEYWORD);
- } else {
- $(document).trigger(EVENT_SEARCH, keyword);
- $('#clear_keyword').show();
- }
- }
-
- // 清空输入框
- $('#clear_keyword').on('click', function () {
- $('#search_keyword').val('');
- $('#search_keyword').focus();
- $(document).trigger(EVENT_CLEAR_KEYWORD);
- });
-
- // 点击高亮显示
- $('#search_keyword').on('focus', function () {
- $('.search-left').css(
- {
- "border-style":"solid",
- "border-color": "rgba(24, 144, 255, 1)",
- "box-shadow": "0px 0px 2px 1px rgba(145, 213, 255, 0.96)",
- }
- );
- }).on('blur', function () {
- $('.search-left').prop('style','');
- });
- // 搜索
- $('#search_submit').on('click', function () {
- var keyword = $('#search_keyword').val();
- var type = getSeachType();
- var baseUrl = search_types.find(function (item) {
- return item.type === type;
- });
- if (baseUrl && keyword) {
- window.open(baseUrl.url + keyword);
- }
- });
-
-
- // 推荐结果跳转
- $('#search_result').on('click', 'li', function () {
- var word = $(this).text();
- $('#search_keyword').val(word);
- openSearch(word);
- $('#search_result').hide();
- });
-
- $(document).on(EVENT_CLEAR_KEYWORD, function () {
- $('#clear_keyword').hide();
- $('#search_result').hide();
- });
- $(document).on(EVENT_SEARCH, function (e, keyword) {
- getSearchResult(keyword);
- });
-
- // 获取搜索引擎类型
- function getSeachType() {
- return $('#search_logo').data('type');
- }
-
- // google 搜索结果
- function searchResultGoogle(data) {
- var result = data[1];
- result = result.map(function (item) {
- return item[0];
- });
- renderSearchResult(result);
- }
-
- // 百度 搜索结果
- function searchResultBaidu(data) {
- if (data === undefined) {
- return;
- }
- var result = data.s;
- renderSearchResult(result);
- }
-
- // 渲染搜索结果
- function renderSearchResult(array) {
- var $result = $('#search_result');
- $result.empty().hide();
- if (!array || array.length <= 0) {
- return;
- }
- for (var i = 0; i < array.length; i++) {
- var $li = $('');
- $li.text(array[i]);
- $result.append($li);
- }
- $result.show();
- }
-
- window.searchResultGoogle = searchResultGoogle;
- window.searchResultBaidu = searchResultBaidu;
-
- var search_suggest = {
- baidu: {
- url: 'https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su',
- data: function (keyword) {
- return {
- wd: keyword,
- cb: 'window.searchResultBaidu',
- };
- },
- },
- google: {
- url: 'http://suggestqueries.google.com/complete/search',
- data: function (keyword) {
- return {
- q: keyword,
- jsonp: 'window.searchResultGoogle',
- client: 'youtube',
- };
- },
- },
- wangpan: {
- url: 'http://unionsug.baidu.com/su',
- data: function (keyword) {
- return {
- wd: keyword,
- cb: 'window.searchResultBaidu',
- };
- },
- },
- };
-
- function getSearchResult(keyword) {
- var searchType = getSeachType();
- var suggest = search_suggest[searchType];
- if (!suggest) {
- suggest = search_suggest.baidu;
- }
- $.ajax({
- url: suggest.url,
- dataType: 'jsonp',
- data: suggest.data(keyword),
- });
- }
-
- function openSearch(keyword) {
- var type = getSeachType();
- var baseUrl = search_types.find(function (item) {
- return item.type === type;
- });
- if (baseUrl && keyword) {
- window.open(baseUrl.url + keyword);
- }
- }
+$(function () {
+
+ // 默认搜索引擎记录
+ var searchTypeStore = {
+ set: function (type) {
+ localStorage.setItem('SearchType', type);
+ },
+ get: function () {
+ return localStorage.getItem('SearchType') || 'baidu';
+ },
+ };
+
+ var $searchMethods = $('#search_methods');
+ var $searchLogo = $('#search_logo');
+ var initSearchType = searchTypeStore.get();
+ $searchLogo.addClass(initSearchType).data('type', initSearchType);
+
+ var search_types = [
+ { url: 'https://www.baidu.com/s?wd=', type: 'baidu' },
+ { url: 'https://www.sogou.com/web?query=', type: 'sogou' },
+ { url: 'https://cn.bing.com/search?q=', type: 'bing' },
+ { url: 'https://www.so.com/s?q=', type: 'so' },
+ { url: 'https://www.google.com/search?q=', type: 'google' },
+ { url: 'http://www.cilimao.cc/search?word=', type: 'cili' },
+ { url: 'http://neets.cc/search?key=', type: 'yingyin' },
+ { url: 'http://www.panduoduo.net/s/name/', type: 'wangpan' },
+ ];
+ $searchLogo.on('click', function () {
+ $searchMethods.show();
+ });
+
+ // 搜索引擎切换
+ $searchMethods.on('click', 'li', function () {
+ var type = $(this).data('type');
+ searchTypeStore.set(type);
+ $searchLogo.removeClass()
+ .data('type', type)
+ .addClass(type + ' search-logo');
+ $searchMethods.hide();
+ $('#search_keyword').focus();
+ });
+ $searchMethods.on('mouseleave', function () {
+ $searchMethods.hide();
+ });
+
+ var EVENT_CLEAR_KEYWORD = 'clearKeyword';
+ var EVENT_SEARCH = 'search';
+ // 关键词搜索输入
+ $('#search_keyword').on('keyup', function (event) {
+ var $keyword = $(this);
+ var keyword = $keyword.val();
+ if(event.which==13){
+ if($('#search_result .active').length>0){
+ keyword = $('#search_result .active').eq(0).text();
+ }
+ openSearch(keyword)
+ return;
+ }
+ // TODO 上下键选择待选答案
+ var bl = moveChange(event);
+ if(bl){
+ keywordChange(keyword);
+ }
+ }).on('blur', function () {
+ $('#search_result').hide();
+ }).on('focus', function () {
+ var keyword = $(this).val();
+ keywordChange(keyword);
+ });
+
+ function moveChange(e){
+ var k = e.keyCode || e.which;
+ var bl = true;
+ switch(k){
+ case 38:
+ rowMove('top');
+ bl = false;
+ break;
+ case 40:
+ rowMove('down');
+ bl = false;
+ break;
+ }
+ return bl;
+ }
+ function rowMove(move){
+ var search_result = $('#search_result');
+ var hove_li = null;
+ search_result.find('.result-item').each(function(){
+ if($(this).hasClass('active')){
+ hove_li = $(this).index();
+ }
+ });
+ if(move == 'top'){
+ if(hove_li==null){
+ hove_li = search_result.find('.result-item').length-1;
+ }else{
+ hove_li--;
+ }
+ }else if(move == 'down'){
+ if(hove_li==null){
+ hove_li = 0;
+ }else{
+ hove_li==search_result.find('.result-item').length-1?(hove_li=0):(hove_li++);
+ }
+ }
+ search_result.find('.active').removeClass('active');
+ search_result.find('.result-item').eq(hove_li).addClass('active');
+ }
+
+ function keywordChange(keyword) {
+ if (keyword === '') {
+ $(document).trigger(EVENT_CLEAR_KEYWORD);
+ } else {
+ $(document).trigger(EVENT_SEARCH, keyword);
+ $('#clear_keyword').show();
+ }
+ }
+
+ // 清空输入框
+ $('#clear_keyword').on('click', function () {
+ $('#search_keyword').val('');
+ $('#search_keyword').focus();
+ $(document).trigger(EVENT_CLEAR_KEYWORD);
+ });
+
+ // 点击高亮显示
+ $('#search_keyword').on('focus', function () {
+ $('.search-left').css(
+ {
+ "border-style":"solid",
+ "border-color": "rgba(24, 144, 255, 1)",
+ "box-shadow": "0px 0px 2px 1px rgba(145, 213, 255, 0.96)",
+ }
+ );
+ }).on('blur', function () {
+ $('.search-left').prop('style','');
+ });
+ // 搜索
+ $('#search_submit').on('click', function () {
+ var keyword = $('#search_keyword').val();
+ var type = getSeachType();
+ var baseUrl = search_types.find(function (item) {
+ return item.type === type;
+ });
+ if (baseUrl && keyword) {
+ window.open(baseUrl.url + keyword);
+ }
+ });
+
+
+ // 推荐结果跳转
+ $('#search_result').on('click', 'li', function () {
+ var word = $(this).text();
+ $('#search_keyword').val(word);
+ openSearch(word);
+ $('#search_result').hide();
+ });
+
+ $(document).on(EVENT_CLEAR_KEYWORD, function () {
+ $('#clear_keyword').hide();
+ $('#search_result').hide();
+ });
+ $(document).on(EVENT_SEARCH, function (e, keyword) {
+ getSearchResult(keyword);
+ });
+
+ // 获取搜索引擎类型
+ function getSeachType() {
+ return $('#search_logo').data('type');
+ }
+
+ // google 搜索结果
+ function searchResultGoogle(data) {
+ var result = data[1];
+ result = result.map(function (item) {
+ return item[0];
+ });
+ renderSearchResult(result);
+ }
+
+ // 百度 搜索结果
+ function searchResultBaidu(data) {
+ if (data === undefined) {
+ return;
+ }
+ var result = data.s;
+ renderSearchResult(result);
+ }
+
+ // 渲染搜索结果
+ function renderSearchResult(array) {
+ var $result = $('#search_result');
+ $result.empty().hide();
+ if (!array || array.length <= 0) {
+ return;
+ }
+ for (var i = 0; i < array.length; i++) {
+ var $li = $('');
+ $li.text(array[i]);
+ $result.append($li);
+ }
+ $result.show();
+ }
+
+ window.searchResultGoogle = searchResultGoogle;
+ window.searchResultBaidu = searchResultBaidu;
+
+ var search_suggest = {
+ baidu: {
+ url: 'https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su',
+ data: function (keyword) {
+ return {
+ wd: keyword,
+ cb: 'window.searchResultBaidu',
+ };
+ },
+ },
+ google: {
+ url: 'http://suggestqueries.google.com/complete/search',
+ data: function (keyword) {
+ return {
+ q: keyword,
+ jsonp: 'window.searchResultGoogle',
+ client: 'youtube',
+ };
+ },
+ },
+ wangpan: {
+ url: 'http://unionsug.baidu.com/su',
+ data: function (keyword) {
+ return {
+ wd: keyword,
+ cb: 'window.searchResultBaidu',
+ };
+ },
+ },
+ };
+
+ function getSearchResult(keyword) {
+ var searchType = getSeachType();
+ var suggest = search_suggest[searchType];
+ if (!suggest) {
+ suggest = search_suggest.baidu;
+ }
+ $.ajax({
+ url: suggest.url,
+ dataType: 'jsonp',
+ data: suggest.data(keyword),
+ });
+ }
+
+ function openSearch(keyword) {
+ var type = getSeachType();
+ var baseUrl = search_types.find(function (item) {
+ return item.type === type;
+ });
+ if (baseUrl && keyword) {
+ window.open(baseUrl.url + keyword);
+ }
+ }
});
\ No newline at end of file