搜索历史的js

//保存关键字到历史记录
			saveKeyword(keyword) {
				console.log(uni.getStorageSync('historyList'),'先获取缓存historyList');
				uni.getStorage({
					key: 'historyList',
					success: (res) => {
						console.log('获取缓存成功',res);
						let OldKeys = res.data || [];
						let findIndex = OldKeys.indexOf(keyword);
						if (findIndex == -1) {
							OldKeys.unshift(keyword);
						} else {
							OldKeys.splice(findIndex, 1);
							OldKeys.unshift(keyword);
						}
						//最多10个纪录
						OldKeys.length > 10 && OldKeys.pop();
						uni.setStorage({
							key: 'historyList',
							data: OldKeys
						});
						this.historyList = OldKeys; //更新历史搜索
					},
					fail: (e) => {
						let OldKeys = [keyword];
						uni.setStorage({
							key: 'historyList',
							data: OldKeys
						});
						this.oldKeywordList = OldKeys; //更新历史搜索
						console.log('获取缓存失败');
					}
				});
			},

  • 9
    点赞
  • 11
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
可以使用localStorage存储搜索历史记录,具体实现可以参考以下代码: 首先在HTML中添加一个搜索框和一个搜索历史记录列表: ```html <input type="text" id="searchBox"> <ul id="historyList"></ul> ``` 然后在JavaScript中实现搜索历史记录的存储和展示: ```js // 获取搜索历史记录 function getHistory() { let history = localStorage.getItem('searchHistory'); if (history) { return JSON.parse(history); } else { return []; } } // 添加搜索历史记录 function addHistory(keyword) { let history = getHistory(); if (history.indexOf(keyword) === -1) { history.push(keyword); localStorage.setItem('searchHistory', JSON.stringify(history)); } } // 清空搜索历史记录 function clearHistory() { localStorage.removeItem('searchHistory'); } // 展示搜索历史记录 function showHistory() { let history = getHistory(); let html = ''; for (let i = history.length - 1; i >= 0; i--) { html += '<li>' + history[i] + '</li>'; } document.querySelector('#historyList').innerHTML = html; } // 监听搜索框输入事件 document.querySelector('#searchBox').addEventListener('input', function() { let keyword = this.value.trim(); if (keyword) { addHistory(keyword); } }); // 页面加载时展示搜索历史记录 window.addEventListener('load', function() { showHistory(); }); // 清空搜索历史记录 document.querySelector('#clearBtn').addEventListener('click', function() { clearHistory(); showHistory(); }); ``` 以上代码实现了搜索历史记录的存储、添加、清空和展示功能。当用户输入关键词时,将关键词添加到搜索历史记录中;页面加载时展示搜索历史记录;当用户点击清空按钮时,清空搜索历史记录并重新展示。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值