背景：
移动端的搜索记录，不可能通过调取接口来记录瑟，所以通过在某某.js一个文件定义和处理逻辑。
代码：
javascript
//某某.js
var yumingSearch = {
init: function () {
initF7.GloblalF7.onPageInit("yumingSearch", function (data) {
yumingSearch.bindDomEvent();
});
/**
* 我的页面返回按钮时执行
*/
initF7.GloblalF7.onPageAfterBack("yumingSearch", function (page) {
MAPutils.GlobalMap.updateSize();
layui.layer.closeAll();
});
},
bindDomEvent: function () {
let searchValue = GlobalUtils.debounce(yumingSearch.searchValue, 400)
$(".yuming-search-input").on("input propertychange", function (e) {
searchValue($(this).val())
})
$(".yuming-search-quxiao").on("click", function () {
$(".yuming-search-list").empty()
$(".yuming-search-input").val("")
})
if (Config.isMobile) {
this.setSearchSql(this.getSql)
}
$(".sousuo-shanchu").on("clcik", function () {
yumingSearch.setSearchSql(yumingSearch.delSql)
})
},
listPageV2: null,
searchValue: function (val) {
if (!val) {
return
}
if (yumingSearch.listPageV2) {
yumingSearch.listPageV2.abort();
}
yumingSearch.listPageV2 = $.ajax({
url: Config.API_SERVER_URL + "/enav/appTemplabel/listPageV2",
type: "POST",
data: {
param: JSON.stringify({
page: 1,
limit: 50,
names: val,
dataType: 1,
username: Config.userInfo.name
})
}
}).always(function (res) {
if (res.data && res.data.length > 0) {
let content = ""
$.each(res.data, function (i, item) {
content += `<div class="yuming-search-item" data-obj='${JSON.stringify(item)}'>${item.names}</div>`
})
$(".yuming-search-list").html(content);
$(".yuming-search-item").on("click", function () {
let obj = $(this).attr("data-obj");
if (obj) {
MapInit.backMap();
let o = JSON.parse(obj)
MAPutils.createYmQuyu(o)
yumingSearch.setSearchSql(yumingSearch.saveSql, obj)
}
})
} else {
// layui.layer.msg("暂无相关数据")
$(".yuming-search-list").html('<div class="yuming-search-item">暂无相关数据</div>')
}
})
},
setSearchSql: function (callback, obj) {
var db = window.sqlitePlugin.openDatabase({
name: Config.databasename,
location: 'default',
})
db.transaction(
function (tx) {
tx.executeSql(
"CREATE TABLE IF NOT EXISTS ymSearch (guid text,jsonobj text,createdTime TimeStamp DEFAULT (datetime('now','localtime')))"
)
callback(tx, obj)
}
)
},
saveSql: function (tx, obj) {
tx.executeSql("SELECT * FROM ymSearch WHERE guid = ?", [obj.guid], function (tx, res) {
if (res.rows.length > 0) {
tx.executeSql("UPDATE ymSearch set jsonobj = ? WHERE guid = ?", [JSON.stringify(obj), obj.guid], function (tx, res) {
// layui.layer.msg('修改成功！');
}, function (e) {
// layui.layer.msg('修改失败，插入数据！');
})
} else {
tx.executeSql("INSERT INTO ymSearch (guid,jsonobj) VALUES (?,?)", [obj.guid, JSON.stringify(obj)], function (tx, res) {
// layui.layer.msg('插入成功！');
console.log('插入成功！');
}, function (e) {
console.log("插入失败了呀");
})
}
})
},
delSql: function (tx) {
tx.executeSql("DELETE FROM ymSearch", [], function (tx, res) {
if (res.rowsAffected > 0) {
// layui.layer.msg('清除成功！')
$('.yuming-jilu-box').empty()
}
}, function (e) {
layui.layer.msg('清除失败！')
})
},
getSql: function (tx) {
tx.executeSql("SELECT * FROM ymSearch DESC LIMIT 10", [], function (tx, res) {
if (res.rows.length > 0) {
let content = "";
for (var i = 0; i < res.rows.length; i++) {
let obj = JSON.parse(JSON.parse(res.rows.item(i).jsonobj));
content += `<div class="yuming-jilu-item" data-obj='${JSON.stringify(obj)}'>${obj.names}</div>`
}
$('.yuming-jilu-box').html(content);
$(".yuming-jilu-item").on("click", function () {
let obj = $(this).attr("data-obj");
if (obj) {
MapInit.backMap();
let o = JSON.parse(obj)
MAPutils.createYmQuyu(o)
}
})
}
})
}
}
yumingSearch.init();核心方法：
外部通过调用这个方法，并传callback()
实际代码：
外部使用，如下：
javascript
var mainSearchLog = {
init: function () {
initF7.GloblalF7.onPageInit("mainSearchLog", function (data) {
mainSearchLog.bindDomEvent();
});
/**
* 返回按钮时执行
*/
initF7.GloblalF7.onPageAfterBack("mainSearchLog", function (page) {
MAPutils.GlobalMap.updateSize();
});
},
bindDomEvent: function () {
if (Config.isMobile) {
yumingSearch.setSearchSql(mainSearchLog.getYumingSearchSql)
}
},
/**
* 判断手机端
* 查询yumingSearch sql表
*/
getYumingSearchSql: function (tx) {
tx.executeSql("SELECT * FROM ymSearch DESC LIMIT 50", [], function (tx, res) {
if (res.rows.length > 0) {
let content = "";
for (var i = 0; i < res.rows.length; i++) {
let obj = JSON.parse(JSON.parse(res.rows.item(i).jsonobj));
content += `<div class="search-log-box" data-obj='${JSON.stringify(obj)}'>${obj.names}</div>`
}
$('.yuming .searchLogBox').html(content);
$(".search-log-box").on("click", function () {
let obj = $(this).attr("data-obj");
if (obj) {
MapInit.backMap();
let o = JSON.parse(obj)
MAPutils.createYmQuyu(o)
}
})
}
})
},
}
mainSearchLog.init()核心调用：
