优化了底部署名栏;优化了input的聚焦事件

This commit is contained in:
vitamin
2019-01-08 17:51:27 +08:00
parent 5aa91c20d6
commit f7cd1a5cb7
4 changed files with 205 additions and 173 deletions

View File

@@ -1,179 +1,177 @@
<!doctype html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>只言片语网址导航</title> <title>只言片语导航 &nbsp;- 不懂就搜,一搜就懂</title>
<meta name="viewport" <meta name="keywords" content="只言片语导航,不懂就搜,实用网址,主页导航,简单网址导航">
content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"/>
<meta content="telephone=no,email=no" name="format-detection">
<!-- // 禁止自动识别电话号码和邮箱 -->
<meta content="yes" name="apple-mobile-web-app-capable">
<!-- // 苹果手机:会删除默认的工具栏和菜单栏,网站 开启对web app程序的支持 -->
<meta name="apple-mobile-web-app-status-bar-style" content="black"/>
<!-- // 苹果手机在web app应用下状态条屏幕顶部条的颜色,默认值为default白色可以定为black黑色和black-translucent灰色半透明-->
<meta name="apple-touch-fullscreen" content="yes"/>
<!-- // 苹果手机如果把一个web app添加到了主屏幕中那么从主屏幕中打开这个web app则全屏显示 -->
<meta name="keywords" content="只言片语导航,极简主义导航,实用网址,极速导航,简单网址导航">
<meta name="description" content="只言片语,可寻万物!"/> <meta name="description" content="只言片语,可寻万物!"/>
<link rel="shortcut icon" href="static/img/favicon.ico"> <link rel="shortcut icon" href="static/img/favicon.ico">
<link href="static/css/style.css" rel="stylesheet" type="text/css"> <link href="static/css/style.css" rel="stylesheet" type="text/css">
<!--源代码来自小呆导航 http://webjike.com本站已获授权使用请勿完全抄袭源码请勿声明自己是原创--> <!-- 百度统计代码 -->
<script>
</head> var _hmt = _hmt || [];
(function() {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?786a6208323fbecfb41d71bfda8daca6";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</script>
</head>
<body> <body>
<div class="inner-center main"> <div class="inner-center main">
<!-- slogan start --> <div class="content-inside">
<div class="logo-box"> <!-- slogan start -->
<div class="logo-left"> <div class="logo-box">
<img src="./static/img/logo.gif" alt="logo"> <div class="logo-left">
</div> <img src="./static/img/logo.gif" alt="logo">
<div class="logo-right"> </div>
<span>只言片语,可寻万物</span> <div class="logo-right">
</div> <span>只言片语,可寻万物</span>
</div>
<!-- slogan end -->
<!-- 搜索框 start -->
<div id="search_form" class="search-section"target="_blank">
<div class="search-left">
<div id="search_logo" data-type="google" class="search-logo"></div>
<div class="input-wrap">
<input id="search_keyword"
class="search-input"
name="keyword"
maxlength="100"
autocomplete="off"
type="text"
placeholder="搜,不会就搜,给老子搜!">
<div class="clear-keyword" id="clear_keyword" title="清空">x</div>
</div> </div>
<!-- 搜索引擎 start -->
<ul id="search_methods" class="search-methods">
<li data-type="google" class="search-item google">谷歌</li>
<li data-type="baidu" class="search-item baidu">百度</li>
<li data-type="bing" class="search-item bing">必应</li>
<li data-type="so" class="search-item so">360搜索</li>
<li data-type="sogou" class="search-item sogou">搜狗</li>
<li data-type="wangpan" class="search-item wangpan">网盘搜索</li>
</ul>
<!-- 搜索引擎 end -->
<!-- 搜索结果 start -->
<ul id="search_result" class="search-result">
<!--<li class="result-item"></li>-->
</ul>
<!-- 搜索结果 end -->
</div> </div>
<input class="search-submit" value="" id="search_submit" type="submit"> <!-- slogan end -->
</div>
<!-- 搜索框 end --> <!-- 搜索框 start -->
<div id="search_form" class="search-section"target="_blank">
<!-- 导航地址 start --> <div class="search-left">
<div class="nav-content"> <div id="search_logo" data-type="google" class="search-logo"></div>
<div class="jj-list"> <div class="input-wrap">
<div class="jj-list-tit">麦 · Mai</div> <input id="search_keyword"
<ul class="jj-list-con"> class="search-input"
<li><a href="https://www.google.com/" class="jj-list-link" target="_blank">Google</a></li> name="keyword"
<li><a href="https://www.baidu.com/" class="jj-list-link" target="_blank">百度</a></li> maxlength="100"
<li><a href="https://cn.bing.com/" class="jj-list-link" target="_blank">Bing</a></li> autocomplete="off"
<li><a href="https://www.sogou.com/" class="jj-list-link" target="_blank">搜狗搜索</a></li> type="text"
<li><a href="https://www.so.com/" class="jj-list-link" target="_blank">360搜索</a></li> placeholder="不懂么?不懂就搜,给老子搜!">
<li><a href="https://www.toutiao.com/search/?keyword=/" class="jj-list-link" target="_blank">头条搜索</a></li> <div class="clear-keyword" id="clear_keyword" title="清空">x</div>
<li><a href="https://translate.google.cn/" class="jj-list-link" target="_blank">谷歌翻译</a></li> </div>
<li><a href="https://fanyi.baidu.com/" class="jj-list-link" target="_blank">百度翻译</a></li> <!-- 搜索引擎 start -->
<li><a href="http://fanyi.youdao.com/" class="jj-list-link" target="_blank">有道翻译</a></li> <ul id="search_methods" class="search-methods">
</ul> <li data-type="google" class="search-item google">谷歌</li>
<li data-type="baidu" class="search-item baidu">百度</li>
<li data-type="bing" class="search-item bing">必应</li>
<li data-type="so" class="search-item so">360搜索</li>
<li data-type="sogou" class="search-item sogou">搜狗</li>
<li data-type="wangpan" class="search-item wangpan">网盘搜索</li>
</ul>
<!-- 搜索引擎 end -->
<!-- 搜索结果 start -->
<ul id="search_result" class="search-result">
<!--<li class="result-item"></li>-->
</ul>
<!-- 搜索结果 end -->
</div>
<input class="search-submit" value="" id="search_submit" type="submit">
</div> </div>
<div class="jj-list"> <!-- 搜索框 end -->
<div class="jj-list-tit">胖 · Pang</div>
<ul class="jj-list-con"> <!-- 导航地址 start -->
<li><a href="https://www.zhihu.com/" class="jj-list-link" target="_blank">知乎</a></li> <div class="nav-content">
<li><a href="https://web.okjike.com/feed/" class="jj-list-link" target="_blank">即刻</a></li> <div class="jj-list">
<li><a href="https://www.v2ex.com/" class="jj-list-link" target="_blank">V2EX</a></li> <div class="jj-list-tit">麦 · Mai</div>
<li><a href="https://weibo.com/" class="jj-list-link" target="_blank">微博</a></li> <ul class="jj-list-con">
<li><a href="https://www.jianshu.com/" class="jj-list-link" target="_blank">简书</a></li> <li><a href="https://www.google.com/" class="jj-list-link" target="_blank">Google</a></li>
<li><a href="https://www.douban.com/" class="jj-list-link" target="_blank">豆瓣</a></li> <li><a href="https://www.baidu.com/" class="jj-list-link" target="_blank">百度</a></li>
<li><a href="http://www.woshipm.com/" class="jj-list-link" target="_blank">产品经理</a></li> <li><a href="https://cn.bing.com/" class="jj-list-link" target="_blank">Bing</a></li>
<li><a href="http://www.chanpin100.com/" class="jj-list-link" target="_blank">产品壹佰</a></li> <li><a href="https://www.sogou.com/" class="jj-list-link" target="_blank">搜狗搜索</a></li>
<li><a href="http://someword.me/" class="jj-list-link" target="_blank">只言片语</a></li> <li><a href="https://www.so.com/" class="jj-list-link" target="_blank">360搜索</a></li>
</ul> <li><a href="https://www.toutiao.com/search/?keyword=/" class="jj-list-link" target="_blank">头条搜索</a></li>
</div> <li><a href="https://translate.google.cn/" class="jj-list-link" target="_blank">谷歌翻译</a></li>
<div class="jj-list"> <li><a href="https://fanyi.baidu.com/" class="jj-list-link" target="_blank">百度翻译</a></li>
<div class="jj-list-tit">皮 · Pi</div> <li><a href="http://fanyi.youdao.com/" class="jj-list-link" target="_blank">有道翻译</a></li>
<ul class="jj-list-con"> </ul>
<li><a href="https://ke.qq.com/" class="jj-list-link" target="_blank">腾讯课堂</a></li> </div>
<li><a href="https://study.163.com/" class="jj-list-link" target="_blank">网页云课堂</a></li> <div class="jj-list">
<li><a href="https://www.imooc.com/" class="jj-list-link" target="_blank">慕课网</a></li> <div class="jj-list-tit">胖 · Pang</div>
<li><a href="https://www.bilibili.com/" class="jj-list-link" target="_blank">哔哩哔哩</a></li> <ul class="jj-list-con">
<li><a href="https://www.iqiyi.com/" class="jj-list-link" target="_blank">爱奇艺</a></li> <li><a href="https://www.zhihu.com/" class="jj-list-link" target="_blank">知乎</a></li>
<li><a href="https://v.qq.com/" class="jj-list-link" target="_blank">腾讯视频</a></li> <li><a href="https://web.okjike.com/feed/" class="jj-list-link" target="_blank">即刻</a></li>
<li><a href="https://www.youku.com/" class="jj-list-link" target="_blank">优酷</a></li> <li><a href="https://www.v2ex.com/" class="jj-list-link" target="_blank">V2EX</a></li>
<li><a href="http://cpc.people.com.cn/" class="jj-list-link" target="_blank">1024</a></li> <li><a href="https://weibo.com/" class="jj-list-link" target="_blank">微博</a></li>
<li><a href="http://www.zimuzu.tv/" class="jj-list-link" target="_blank">人人影视</a></li> <li><a href="https://www.jianshu.com/" class="jj-list-link" target="_blank">简书</a></li>
<li><a href="https://www.douban.com/" class="jj-list-link" target="_blank">豆瓣</a></li>
</ul> <li><a href="http://www.woshipm.com/" class="jj-list-link" target="_blank">产品经理</a></li>
</div> <li><a href="http://www.chanpin100.com/" class="jj-list-link" target="_blank">产品壹佰</a></li>
<div class="jj-list"> <li><a href="http://someword.me/" class="jj-list-link" target="_blank">只言片语</a></li>
<div class="jj-list-tit">笑 · Xiao</div> </ul>
<ul class="jj-list-con"> </div>
<li><a href="https://www.36kr.com//" class="jj-list-link" target="_blank">36氪</a></li> <div class="jj-list">
<li><a href="https://www.huxiu.com/" class="jj-list-link" target="_blank">虎嗅</a></li> <div class="jj-list-tit">皮 · Pi</div>
<li><a href="https://www.toutiao.com/" class="jj-list-link" target="_blank">今日头条</a></li> <ul class="jj-list-con">
<li><a href="https://minapp.com/" class="jj-list-link" target="_blank">知晓程序</a></li> <li><a href="https://ke.qq.com/" class="jj-list-link" target="_blank">腾讯课堂</a></li>
<li><a href="https://sspai.com/" class="jj-list-link" target="_blank">少数派</a></li> <li><a href="https://study.163.com/" class="jj-list-link" target="_blank">网易云课堂</a></li>
<li><a href="http://ac.scmor.com/" class="jj-list-link" target="_blank">谷歌镜像</a></li> <li><a href="https://www.imooc.com/" class="jj-list-link" target="_blank">慕课网</a></li>
<li><a href="https://youquhome.com/" class="jj-list-link" target="_blank">GitHub</a></li> <li><a href="https://www.bilibili.com/" class="jj-list-link" target="_blank">哔哩哔哩</a></li>
<li><a href="https://coding.net/" class="jj-list-link" target="_blank">Coding</a></li> <li><a href="https://www.iqiyi.com/" class="jj-list-link" target="_blank">爱奇艺</a></li>
<li><a href="https://www.coolist.net/" class="jj-list-link" target="_blank">酷软清单</a></li> <li><a href="https://v.qq.com/" class="jj-list-link" target="_blank">腾讯视频</a></li>
</ul> <li><a href="https://www.youku.com/" class="jj-list-link" target="_blank">优酷</a></li>
</div> <li><a href="http://cpc.people.com.cn/" class="jj-list-link" target="_blank">1024</a></li>
<div class="jj-list"> <li><a href="http://www.zimuzu.tv/" class="jj-list-link" target="_blank">人人影视</a></li>
<div class="jj-list-tit">嘻 · Xi</div>
<ul class="jj-list-con">
<li><a href="https://map.baidu.com/" class="jj-list-link" target="_blank">百度地图</a></li>
<li><a href="http://www.google.cn/maps" class="jj-list-link" target="_blank">谷歌地图</a></li>
<li><a href="https://www.amap.com/" class="jj-list-link" target="_blank">高德地图</a></li>
<li><a href="https://sm.ms/" class="jj-list-link" target="_blank">SM图床</a></li>
<li><a href="https://tool.lu/" class="jj-list-link" target="_blank">程序员工具</a></li>
<li><a href="http://www.alloyteam.com/nav/" class="jj-list-link" target="_blank">前端工具</a></li>
<li><a href="http://www.panduoduo.net/" class="jj-list-link" target="_blank">网盘搜索</a></li>
<li><a href="https://cli.im/" class="jj-list-link" target="_blank">二维码</a></li>
<li><a href="http://www.qinms.com/webapp/barcode/index.aspx" class="jj-list-link" target="_blank">条形码</a></li>
</ul>
</div>
<div class="jj-list">
<div class="jj-list-tit">嘻 · Xi</div>
<ul class="jj-list-con">
<li><a href="http://www.dytt8.net/" class="jj-list-link" target="_blank">电影天堂</a></li> </ul>
<li><a href="https://zhuanlan.zhihu.com/p/36456284" class="jj-list-link" target="_blank">图片素材</a></li> </div>
<li><a href="https://www.portablesoft.org/" class="jj-list-link" target="_blank">效率工具</a></li> <div class="jj-list">
<li><a href="https://www.taobao.com/" class="jj-list-link" target="_blank">淘宝</a></li> <div class="jj-list-tit">笑 · Xiao</div>
<li><a href="https://www.jd.com/" class="jj-list-link" target="_blank">京东</a></li> <ul class="jj-list-con">
<li><a href="https://www.suning.com/" class="jj-list-link" target="_blank">苏宁</a></li> <li><a href="https://www.36kr.com/" class="jj-list-link" target="_blank">36氪</a></li>
<li><a href="https://www.smzdm.com/" class="jj-list-link" target="_blank">什么值得买</a></li> <li><a href="https://www.huxiu.com/" class="jj-list-link" target="_blank">虎嗅</a></li>
<li><a href="http://www.zealer.com/" class="jj-list-link" target="_blank">Zealer</a></li> <li><a href="https://www.toutiao.com/" class="jj-list-link" target="_blank">今日头条</a></li>
<li><a href="http://www.manmanbuy.com/" class="jj-list-link" target="_blank">慢慢买</a></li> <li><a href="https://www.163.com/" class="jj-list-link" target="_blank">网易</a></li>
<li><a href="https://sspai.com/" class="jj-list-link" target="_blank">少数派</a></li>
<li><a href="http://ac.scmor.com/" class="jj-list-link" target="_blank">谷歌镜像</a></li>
</ul> <li><a href="https://youquhome.com/" class="jj-list-link" target="_blank">GitHub</a></li>
<li><a href="https://coding.net/" class="jj-list-link" target="_blank">Coding</a></li>
<li><a href="https://www.coolist.net/" class="jj-list-link" target="_blank">酷软清单</a></li>
</ul>
</div>
<div class="jj-list">
<div class="jj-list-tit">嘻 · Xi</div>
<ul class="jj-list-con">
<li><a href="https://map.baidu.com/" class="jj-list-link" target="_blank">百度地图</a></li>
<li><a href="http://www.google.cn/maps" class="jj-list-link" target="_blank">谷歌地图</a></li>
<li><a href="https://www.amap.com/" class="jj-list-link" target="_blank">高德地图</a></li>
<li><a href="https://sm.ms/" class="jj-list-link" target="_blank">SM图床</a></li>
<li><a href="https://tool.lu/" class="jj-list-link" target="_blank">程序员工具</a></li>
<li><a href="http://www.alloyteam.com/nav/" class="jj-list-link" target="_blank">前端工具</a></li>
<li><a href="http://www.panduoduo.net/" class="jj-list-link" target="_blank">网盘搜索</a></li>
<li><a href="https://cli.im/" class="jj-list-link" target="_blank">二维码</a></li>
<li><a href="http://www.qinms.com/webapp/barcode/index.aspx" class="jj-list-link" target="_blank">条形码</a></li>
</ul>
</div>
<div class="jj-list">
<div class="jj-list-tit">嘻 · Xi</div>
<ul class="jj-list-con">
<li><a href="http://www.dytt8.net/" class="jj-list-link" target="_blank">电影天堂</a></li>
<li><a href="https://zhuanlan.zhihu.com/p/36456284" class="jj-list-link" target="_blank">图片素材</a></li>
<li><a href="https://www.portablesoft.org/" class="jj-list-link" target="_blank">效率工具</a></li>
<li><a href="https://www.taobao.com/" class="jj-list-link" target="_blank">淘宝</a></li>
<li><a href="https://www.jd.com/" class="jj-list-link" target="_blank">京东</a></li>
<li><a href="https://www.suning.com/" class="jj-list-link" target="_blank">苏宁</a></li>
<li><a href="https://www.smzdm.com/" class="jj-list-link" target="_blank">什么值得买</a></li>
<li><a href="http://www.zealer.com/" class="jj-list-link" target="_blank">Zealer</a></li>
<li><a href="http://www.manmanbuy.com/" class="jj-list-link" target="_blank">慢慢买</a></li>
</ul>
</div>
</div> </div>
<!-- 导航地址 end -->
</div> </div>
<!-- 导航地址 end -->
</div> </div>
<footer class="inner-center footer">Copyright © 2019 Hosted by <footer class="inner-center footer">
<a href="http://someword.me" style="color:#05050573;text-decoration:underline" target="_blank">只言片语</a> <p>
<a href="https://github.com/TopVitamin/static-nav"> <img src="./static/css/img/github.png" alt="" height="20" width="20"></a>
</p>
<p style="margin-top:8px;"> <a href="http://someword.me" style="color:#8C8C8C;" target="_blank">Copyright © 2019 Hosted by 只言片语</a></p>
</footer> </footer>
<script src="./static/js/jquery.min.js"></script> <script src="./static/js/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/vue/2.5.21/vue.min.js"></script>
<script src="./static/js/keyword.js"></script> <script src="./static/js/keyword.js"></script>
<!-- livereloadd 调试工具 -->
<script>
document.write('<script src="http://' + (location.host || 'localhost').split(':')[0] +
':35729/livereload.js?snipver=1"></' + 'script>');
</script>
</body> </body>
</html> </html>

BIN
static/css/img/github.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.6 KiB

View File

@@ -22,11 +22,13 @@ li {
a { a {
text-decoration: none text-decoration: none
} }
body { html, body {
background: #fff; background: #fff;
height: 100%;
} }
input[type="button"], input[type="submit"], input[type="reset"] { input[type="button"], input[type="submit"], input[type="reset"] {
-webkit-appearance: none; -webkit-appearance: none;
outline: 0; outline: 0;
@@ -42,11 +44,24 @@ textarea {
.inner-center { .inner-center {
width: 1000px; width: 1000px;
margin: 0 auto; margin: 0 auto;
} }
.main { .main {
margin-top: 130px; 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 start */
.logo-box { .logo-box {
@@ -73,7 +88,7 @@ textarea {
/* 搜索框 start */ /* 搜索框 start */
.search-section { .search-section {
margin-top: 14px; margin-top: 14px;
margin-bottom: 67px; margin-bottom: 40px;
} }
.search-section { .search-section {
position: relative; position: relative;
@@ -183,6 +198,16 @@ textarea {
font-size: 16px; font-size: 16px;
padding-left: 15px; 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 { .input-wrap .clear-keyword {
display: none; display: none;
position: absolute; position: absolute;
@@ -198,14 +223,14 @@ textarea {
width: 123px; width: 123px;
height: 54px; height: 54px;
line-height: 26px; line-height: 26px;
background: url("./img/search.png") #1890ff 60px center no-repeat; background: url("./img/search.png") #1890ff 48px center no-repeat;
-webkit-background-size: 35px 35px; -webkit-background-size: 35px 35px;
background-size: 35px 35px; background-size: 35px 35px;
color: #fff; color: #fff;
font-size: 18px; font-size: 18px;
text-align: center; text-align: center;
font-family: Roboto; font-family: Roboto;
border: 0; border: 1px solid #1890ff;
cursor: pointer; cursor: pointer;
} }
@@ -216,11 +241,7 @@ textarea {
} }
/* 导航内容 end */ /* 导航内容 end */
.footer {
margin-top: 210px;
text-align: center;
padding-bottom: 14px;
}
/*内容区域*/ /*内容区域*/
/*-----------------------------简洁版样式定义- 开始---------------------------------------------------*/ /*-----------------------------简洁版样式定义- 开始---------------------------------------------------*/
@@ -228,7 +249,7 @@ textarea {
.jj-list { .jj-list {
width: 33.33%; width: 33.33%;
float: left; float: left;
margin-bottom: 40px; margin-bottom: 30px;
padding-right: 16px; padding-right: 16px;
} }
.jj-list:nth-of-type(3n) { .jj-list:nth-of-type(3n) {
@@ -237,7 +258,7 @@ textarea {
.jj-list-tit { .jj-list-tit {
font-size: 16px; font-size: 16px;
line-height: 25px; line-height: 25px;
color: #333; color: rgba(49, 70, 89, 1);
font-weight: bold; font-weight: bold;
} }
.jj-list-con { .jj-list-con {
@@ -255,8 +276,8 @@ textarea {
.jj-list-link { .jj-list-link {
display: block; display: block;
background: #ece8e2 96%; background: rgba(230, 247, 255, 0.96);
color: #333; color:rgba(49, 70, 89, 1);
font-size: 13px; font-size: 13px;
text-align: center; text-align: center;
line-height: 44px; line-height: 44px;
@@ -264,7 +285,7 @@ textarea {
border-radius: 2px; border-radius: 2px;
} }
.jj-list-link:hover { .jj-list-link:hover {
background: #1890ff; background: #1890FF 100%;
font-size: 18px; font-size: 18px;
font-weight: bold; font-weight: bold;
color: #fff; color: #fff;

View File

@@ -78,6 +78,18 @@ $(function () {
$(document).trigger(EVENT_CLEAR_KEYWORD); $(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 () { $('#search_submit').on('click', function () {
var keyword = $('#search_keyword').val(); var keyword = $('#search_keyword').val();
@@ -90,6 +102,7 @@ $(function () {
} }
}); });
// 推荐结果跳转 // 推荐结果跳转
$('#search_result').on('click', 'li', function () { $('#search_result').on('click', 'li', function () {
var word = $(this).text(); var word = $(this).text();