vue实现搜索框记录搜索历史_使用JS location实现搜索框历史记录功能_苏颜_前端开发者...

首先，来看下效果图(样式什么的就不必吐槽了哈)

搜索记录:

//用于保存记录信息

* {

margin: 0;

padding: 0;

}

input {

border: 0;

vertical-align: middle;

float: left;

}

#searchbox {

width: 300px;

height: 50px;

background: #fff;

margin: 100px auto;

border: 1px solid #ccc;

position: relative;

}

#inpt {

width: 240px;

height: 50px;

outline: none;

text-indent: 10px;

}

#btn {

width: 60px;

height: 50px;

cursor: pointer;

}

/* 历史记录框 */

#historybox {

width: 280px;

padding: 10px 10px 50px;

border: 1px solid #ccc;