onmouseover 事件閃爍問題
問題描述
onmouseover 時需要顯示一個層，onmouseout 時隱藏這個層。當鼠標移入的時候顯示層不斷閃爍。
問題原因
顯示層遮住了添加事件的元素，所以反覆執行 onmouseover onmouseout。
解決辦法
給顯示層添加樣式：
pointer-events: none;
移動端 1px 像素問題
問題描述
在移動端web開發中，UI設計稿中設置邊框爲1像素，前端在開發過程中如果出現border:1px，測試會發現在某些機型上，1px會比較粗，即是較經典的 移動端1px像素問題。
問題原因
UI設計師要求的1px是指設備的物理像素1px，而CSS裏記錄的像素是邏輯像素，它們之間存在一個比例關係，通常可以用 javascript 中的 window.devicePixelRatio 來獲取，也可以用媒體查詢的 -webkit-min-device-pixel-ratio 來獲取。當然，比例多少與設備相關
解決辦法
div { height:1px; background:#000; -webkit-transform: scaleY(0.5); -webkit-transform-origin:0 0; overflow: hidden; }
日期函數new Date()瀏覽器兼容性問題
問題描述
後臺傳回來的時間格式一般是字符串“2017-9-10 21:02:02”，然後將字符串轉化爲標準時間
var str = "2017-9-10 21:12:20"; var time = new Date(str); console.log(time);
在蘋果手機上返回NaN的問題。
問題原因
不是瀏覽器都支持“-”，“/”纔是被各大瀏覽器廣泛支持的。
解決辦法
var time = new Date(str.replace("-", "/").replace("-", "/")); var time = new Date(str.replace(/-/g,"/")); var time = new Date("2017","9","10","21","33","33",);
微信分享失敗
問題描述
微信jssdk分享後在IOS上提示認證失敗
問題原因
在分享的連接上帶了json格式字符串
解決辦法
地址欄傳遞都必須爲小寫的簡單參數。
微信小程序onLaunch執行完之後再執行onLoad
問題描述
在onLaunch 李請求權限，在頁面Load 時候還是沒有獲取到權限。
問題原因
小程序初始化時觸發App裏的onLaunch，後面再執行頁面Page裏的onLoad，但是在onLaunch裏請求獲取是否有權限，等待返回值的時候Page裏的onLoad事件就已經執行了。
解決辦法
在Page 的onLoad 增加回調函數，在OnLaunch 執行完請求之後再次執行回調函數。
App({ onLaunch: function () { wx.request({ url: 'test.php', //僅爲示例，並非真實的接口地址 data: { }, success: function(res) { this.globalData.employId = res.employId; //由於這裏是網絡請求，可能會在 Page.onLoad 之後才返回 // 所以此處加入 callback 以防止這種情況 if (this.employIdCallback){ this.employIdCallback(employId); } } }) }, globalData: { employId: '' } }) //index.js //獲取應用實例 const app = getApp() Page({ data: { bindDisabled: false }, onLoad: function () { //判斷是用戶是否綁定了 if (app.globalData.employId && app.globalData.employId != '') { this.setData({ bindDisabled: true }); } else { // 由於 getUserInfo 是網絡請求，可能會在 Page.onLoad 之後才返回 // 所以此處加入 callback 以防止這種情況 app.employIdCallback = employId => { if (employId != '') { this.setData({ bindDisabled: true }); } } } } })
頁面URL傳參的名稱不能是scope
問題描述
我們的一個問題描述小程序頁面不能夠正確獲取後臺返回結果
問題原因
經過打開小程序WebView調試發現WebView 加載的頁面會被自動追加scope參數
解決辦法
調整地址欄參數名稱，到落地頁面後再獲取值後再發送網絡請求
小米瀏覽器class名稱top_box無法顯示
問題描述
在小米瀏覽器中，class名稱爲top_box的元素無法顯示出來
問題原因
小米瀏覽器強制隱藏class名稱爲top_box或者top-box的元素
解決辦法
修改class名稱
參考資料
日期函數new Date()瀏覽器兼容性問題
微信小程序onLaunch執行完之後再執行onLoad