我需要能够将最大5个搜索保存到侧边栏上。当用户单击搜索时，它将重新执行保存的搜索。现在，我正在使用localstorage来保存这些遗迹。目前，我可以将最新搜索保存为从JavaScript对象转换的字符串。很感谢任何形式的帮助！这是代码：
var searchObject = {};
$('.search-button').click(function () {
var business = $('#business-name-button').val();
var industry = $('#industry-button').val();
var job = $('#job-title-button').val();
var revenue = $('#annual-revenue-button').val();
var employeeNumber = $('#number-of-employees-button').val();
var companyYears = $('#company-years-button').val();
var locationAll = $('#location-all-button').val();
var locationSingle = $('#location-single-button').val();
var locationHeadquarter = $('#location-headquarter-button').val();
var locationBranch = $('#location-branch-button').val();
var minorityNone = $('#minority-none-button').val();
var minorityOnly = $('#minority-only-button').val();
var womenNone = $('#women-none-button').val();
var womenOnly = $('#women-only-button').val();
searchObject = {
business: [business],
industry: [industry],
job: [job],
revenue: [revenue],
employeeNumber: [employeeNumber],
companyYears: [companyYears],
locationAll: [locationAll],
locationSingle: [locationSingle],
locationHeadquarter: [locationHeadquarter],
locationBranch: [locationBranch],
minorityNone: [minorityNone],
minorityOnly: [minorityOnly],
womenNone: [womenNone],
womenOnly: [womenOnly]
};
var searchHistory = '';
if (business != '') {
// searchObject.business == $('#business-name-button').val();
searchHistory += "Business Name: " + '<span>' + searchObject.business + "</span>  — ";
};
if (industry != '') {
// searchObject.business == $('#industry-button').val();
searchHistory += "Industry: " + '<span>' + searchObject.industry + "</span>  — ";
};
if (job != '') {
// searchObject.business == $('#industry-button').val();
searchHistory += "Job: " + '<span>' + searchObject.job + "</span>  — ";
};
if (revenue != '') {
// searchObject.business == $('#industry-button').val();
searchHistory += "Anuual Revenue: " + '<span>' + searchObject.revenue + "</span>  — ";
};
if (employeeNumber != '') {
// searchObject.business == $('#industry-button').val();
searchHistory += "# Of Employees: " + '<span>' + searchObject.employeeNumber + "</span>  — ";
};
if (companyYears != '') {
// searchObject.business == $('#industry-button').val();
searchHistory += "Years in Business: " + '<span>' + searchObject.companyYears + "</span>  — ";
};
if (locationAll != '') {
// searchObject.business == $('#industry-button').val();
searchHistory += "All Locations: " + '<span>' + searchObject.locationAll + "</span>  — ";
}; if (locationSingle != '') {
// searchObject.business == $('#industry-button').val();
searchHistory += "Single Locations: " + '<span>' + searchObject.locationSingle + "</span>  — ";
};
if (locationHeadquarter != '') {
// searchObject.business == $('#industry-button').val();
searchHistory += "Headquarter Locations: " + '<span>' + searchObject.locationHeadquarter + "</span>  — ";
};
if (locationBranch != '') {
// searchObject.business == $('#industry-button').val();
searchHistory += "Branch Locations: " + '<span>' + searchObject.locationBranch + "</span>  — ";
};
if (minorityNone != '') {
// searchObject.business == $('#industry-button').val();
searchHistory += "Omit Minorities: " + '<span>' + searchObject.minorityNone + "</span>  — ";
};
if (minorityOnly != '') {
// searchObject.business == $('#industry-button').val();
searchHistory += "Only Minorities: " + '<span>' + searchObject.minorityOnly + "</span>  — ";
};
if (womenNone != '') {
// searchObject.business == $('#industry-button').val();
searchHistory += "Omit Women: " + '<span>' + searchObject.womenNone + "</span>  — ";
};
if (womenOnly != '') {
// searchObject.business == $('#industry-button').val();
searchHistory += "Only Women: " + '<span>' + searchObject.womenOnly + "</span>  — ";
};
$('.middle-content').show('fast');
$('.user-instruct').hide();
$('.saveSearch').prepend(
"<h5>" + "Search" + "</h5>" +
"<p>" + searchHistory.slice(0, -19) + "</p>");
var saveSearchDisplay = $('.saveSearch').html();
localStorage.setItem('saveSearch', JSON.stringify( searchObject ));
localStorage.setItem('saveSearchDisplay', saveSearchDisplay);
return false;
});
if (localStorage.getItem('saveSearchDisplay')) {
$('.saveSearch').html(localStorage.getItem('saveSearchDisplay'));
}
var restoredSession = JSON.parse(localStorage.getItem('saveSearch'));
/*if(localStorage.getItem('saveSearch')) {
$('.saveSearch').html(localStorage.getItem('saveSearch'));
};*/
$('#clearsave').click(function () {
window.localStorage.clear();
location.reload();
return false;
});<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="btn btn-success search-button" type="button">Search</button>
<div class="section-right-content">
<h4>Previous Searches</h4>
<ul class="saveSearch"></ul>
</div>在此处运行时以下会出错，但可以粘贴到控制台中。
function createCircularQ(maxLength, arr) {
const q = arr ? arr.splice(0, maxLength) : [];
q.enqueue = enqueue.bind(null, q, maxLength);
q.dequeue = q.shift;
return q;
}
function enqueue(target, maxLength, o) {
if(target.length === maxLength) {
Array.prototype.pop.call(target);
}
return Array.prototype.unshift.call(target, o);
}
var searches = createCircularQ(5, JSON.parse(localStorage.getItem('searches')));
function search(str) {
searches.enqueue(str);
saveSearches();
// perform search...
}
function saveSearches() {
localStorage.setItem('searches', JSON.stringify(searches));
}
search('foo');
search('bar');
search('bam');
search('bat');
search('baz');
search('bop');
console.log(JSON.stringify(searches));
searches = null;
searches = createCircularQ(5, JSON.parse(localStorage.getItem('searches')));
console.log(JSON.stringify(searches));