最近要根據(jù)需求實(shí)現(xiàn)一個(gè)歷史搜索功能，要實(shí)現(xiàn)的效果圖如下：
1.封裝了一個(gè)讀文件的方法，將從本地文件wisdomLifeData讀取數(shù)據(jù)
FileUtils.readFile = function(fileName, successFn, errorFn) {
????????api.readFile({
????????????path : 'fs://wisdomLifeData/' + fileName
????????}, function(ret, err) {
????????if (ret.status) {
????????????successFn.call(null, $api.strToJson(ret.data == "" ? null : ret.data), null);
????????} else {
????????????console.log(err.msg);
????????????//? ? ? errorFn.call(null, err);
? ? ? ?}
????});
}
2.封裝了一個(gè)寫文件的方法，把數(shù)據(jù)寫本地文件wisdomLifeData中
FileUtils.writeFile = function(jsonData, fileName, successFn, errorFn) {
????????api.writeFile({
????????????path : 'fs://wisdomLifeData/' + fileName,
????????????data : $api.jsonToStr(jsonData)
????????}, function(ret, err) {
????????????if (ret.status) {
????????????????????if (successFn && $.isFunction(successFn)) {
????????????????????successFn.call(null);
????????????}
????????} else {
????????????if (errorFn && $.isFunction(errorFn)) {
????????????????console.log(err.msg);
????????}
????????}
????});
}
3.頁面中的html搜索框及點(diǎn)擊執(zhí)行按鈕
4.實(shí)現(xiàn)思路
????4.1開辟一個(gè)數(shù)組? 該數(shù)組存放8個(gè)value值
? ? ? ? ? ?var recordArr=[];
? ? 4.2點(diǎn)擊搜索按鈕時(shí)將相應(yīng)的value值存進(jìn)數(shù)組及相應(yīng)的json文件中
? ??????//點(diǎn)擊搜索 功能
? ? $("#getResult").click(function(){
????????????if($("#searchVal").val() != ""){
????????????????????recordArr.push($("#searchVal").val());
????????????????????FileUtils.writeFile(recordArr, "historyRecord.json");
????????????????};
? ? });
?4.3 再次進(jìn)入該頁面的 時(shí)候要進(jìn)行讀取文件 將文件中的value寫到 數(shù)組中
? ? 判斷數(shù)組的長度? 截取后8位? 顯示到相應(yīng)的頁面上
? ??FileUtils.readFile("historyRecord.json", function(datas) {
? ??????recordArr=datas;
????????var data=datas;
????????if(datas.length == 0){
????????????$("#history").hide();
????????}
????????if(datas.length>8){
????????????data=datas.slice(data.length-8);
????????}
????var bot="";
????var modle="";
????for(var i=0;i<data.length;i++){
? ? ? ? ? ? //將相應(yīng)的數(shù)據(jù)綁定到頁面上
????}
? ?//完整版 代碼
4.4實(shí)現(xiàn)相應(yīng)的清空歷史記錄功能??
? ? 主體思路：就是將數(shù)組進(jìn)行清空 并將空數(shù)組寫進(jìn)文件中，再次進(jìn)入頁面時(shí)讀取文件則為空
? ? recordArr=[];
? ? FileUtils.writeFile(recordArr, "historyRecord.json");
總結(jié)：
通過對(duì)文件的操作以及和數(shù)組截取相應(yīng)的后八位，就可以實(shí)現(xiàn)歷史記錄在本地的讀取，寫入以及刪除功能……
