? ? webapp開發(fā)新手,遇坑記錄。
? 1.ios系統(tǒng)部分標(biāo)簽綁定click事件無效
要實(shí)現(xiàn)一個(gè)點(diǎn)擊指定控件以外的位置讓該控件消失的功能,在用click事件綁定在body標(biāo)簽想以此監(jiān)聽點(diǎn)擊的屏幕所有位置,在android手機(jī)上測(cè)試時(shí)正常,但是在ios手機(jī)上測(cè)試時(shí)就無法觸發(fā)click事件。改用touchstart的方法之后則在android,ios兩個(gè)系統(tǒng)下都能夠兼容
具體代碼如下:
使用click事件的部分代碼:
var postMessageEl = document.getElementById('postMessage');
var wrapperDataset = postMessageEl.dataset;
$("body").on('click',(function(e){
????if(e.target.id != 'postMessage'){
????????wrapperDataset.flag = "off";
????????displayPopup();
????}else{
????????if(wrapperDataset.flag === "on"){
????????????wrapperDataset.flag = "off";
????????}else{
????????????wrapperDataset.flag = "on";
????????}
????????displayPopup();
????}
}));
使用touchstart事件的部分代碼:
var postMessageEl = document.getElementById('postMessage');
var wrapperDataset = postMessageEl.dataset;
$("body").on('touchstart',(function(e){
????if(e.target.id != 'postMessage'){
????????wrapperDataset.flag = "off";
????????displayPopup();
????}else{
????????if(wrapperDataset.flag === "on"){
????????????wrapperDataset.flag = "off";
????????}else{
????????????wrapperDataset.flag = "on";
????????}
????????displayPopup();
????}
}));
2.用js來動(dòng)態(tài)修改指定標(biāo)簽的css樣式
var testID = document.getElementById('testID');
testID.className = "css樣式名";
3.html主頁面向子頁面?zhèn)鬟f數(shù)據(jù)并且子頁面監(jiān)聽到數(shù)據(jù)變化后執(zhí)行相應(yīng)操作
主頁面代碼:
localStorage.setItem("key","data");
mui.fire(plus.webview.getWebviewById('kid.html'), 'customevent');
子頁面代碼:
window.addEventListener('customevent',function(event){//接受從主頁面?zhèn)鱽淼闹挡⑺⑿马撁?/p>
? ? //監(jiān)聽到主頁面的操作之后,需要執(zhí)行的方法
});
4.水平居中的方法
設(shè)定父控件的 style="width: 100%;text-align: center;"
需要水平居中的控件放在父控件中即可
5.localStorage如何存入和讀取json數(shù)據(jù)
var?jsonData = {'name':?'test',?'age': 188};?// 定義一個(gè)JSON對(duì)象
var?str_jsonData = JSON.stringify(jsonData); //json.stringify用于從一個(gè)json對(duì)象中將數(shù)據(jù)解析成字符串形式
console.log(typeof(str_jsonData));
localStorage.setItem('localData', str_jsonData);?// 存儲(chǔ)字符串?dāng)?shù)據(jù)到本地
var?getLocalData = localStorage.getItem('localData');?// 讀取字符串?dāng)?shù)據(jù)
console.log(typeof(getLocalData));?
var?jsonObj = JSON.parse(getLocalData);//json.parse用于從一個(gè)字符串中解析出json對(duì)象
console.log(typeof(jsonObj));
console.log(jsonObj.age);
6.保存網(wǎng)絡(luò)圖片
//創(chuàng)建下載任務(wù)
? ? ? ? ? ? var dtask = plus.downloader.createDownload(loadUrl, {}, function(d, status) {
? ? ? ? ? ? ? ? if (status == 200) {
? ? ? ? ? ? ? ? ? ? //下載成功
? ? ? ? ? ? ? ? ? ? //本地相對(duì)路徑("_downloads/logo.jpg")轉(zhuǎn)成SD卡絕對(duì)路徑("/storage/emulated/0/Android/data/io.dcloud.HBuilder/.HBuilder/downloads/logo.jpg");
? ? ? ? ? ? ? ? var sd_path = plus.io.convertLocalFileSystemURL(d.filename);
plus.gallery.save(sd_path, function() {
mui.toast("保存成功")
});
? ? ? ? ? ? ? ? } else {
? ? ? ? ? ? ? ? ? ? //下載失敗,需刪除本地臨時(shí)文件,否則下次進(jìn)來時(shí)會(huì)檢查到圖片已存在
? ? ? ? ? ? ? ? }
? ? ? ? ? ? });
? ? ? ? ? ? //啟動(dòng)下載任務(wù)
? ? ? ? ? ? dtask.start();