JS增删改查localStorage实现搜索历史功能
2024-10-21 01:14:37
<script type="text/javascript">
var referrerPath = "@ViewBag.ReferrerPath";//这个是获取来源页的相对路径
var localStorageKey = "search_history"; $(document).ready(function () {
//搜索时记录搜索关键字
$("#imgSearch").click(function () {
var keyword = $("#keyword").val();
setSearchHistory(keyword);
location.href = referrerPath + "?keyword=" + keyword;
}); //显示搜索记录
showSearchHistory(); //删除搜索记录
$("#spanDelete").click(function () {
localStorage.removeItem(localStorageKey);
$(".history_search").html("");
}); function setSearchHistory(keyword) {
var items = getSearchHistory();
if (items.length > 100) {
alert("搜索记录太多,请先清空。");
return;
} var item = { referrerPath, keyword}; for (var i = 0; i < items.length; i++) {
if (items[i].referrerPath === item.referrerPath && items[i].keyword === item.keyword) {
return;
}
} items.push(item);
var strItems = JSON.stringify(items);
localStorage.setItem(localStorageKey, strItems);
} function getSearchHistory() {
var strItems = localStorage.getItem(localStorageKey);
var items = JSON.parse(strItems);
if (items === null) {
items = [];
}
return items;
} function showSearchHistory() {
var arrProductSearchHistroy = new Array();
$.each(getSearchHistory(), function (i, o) {
var url = o.referrerPath + "?keyword=" + o.keyword;
var item = "<li><a href=\""+url+"\">" + o.keyword + "</a></li>";
arrProductSearchHistroy.push(item);
});
$(".history_search").html(arrProductSearchHistroy.join(""));
}
});
</script>
最新文章
- Two Pointers Day
- Maven版本与JDK版本
- django 技巧锦集
- 转帖:如何建立与使用 Window setup project
- nginx缓存模块配置总结proxy_cache(未完)
- css ie7中overflow:hidden失效问题及解决方法
- Codeforces Round #237 (Div. 2) B. Marathon(卡long long)
- 《数据通信与网络》笔记--SCTP
- Python多线程学习笔记
- 去除input[type=number]最右边的spinners(默认加减符号)
- Oracle SQL函数之转换函数
- python学习1(小白记录)
- LNMP之编译安装PHP出现的问题
- Openstack的打包方法
- thinkphp 3.1.3 redis 只能读取 无法写入的问题
- intent详解(一)
- SpringCloud Config服务端
- Unity shader之ColorMask
- #254 Find the Longest Word in a String
- python---文件读写-IO