1.input标签:
页面背景图安卓机上input调起键盘css属性值不能用vh单位(安卓4.4以下不支持vh),input不能是absolute,否则压缩背景图或者背景图不和input一同被顶起。
input调起键盘遮挡输入框解决办法:
focus函数里: setTimeout(function(){ let inputOne = $('.input-one') inputOne.scrollIntoView(false) // ios需要设置 inputOne.scrollIntoViewIfNeeded() },200)
2.一些好用第三方插件:
h5跳app魔窗mLink.JS: (测试打包测试的app要把短链KEY放进去)
<script src="https://static.mlinks.cc/scripts/dist/mlink.min.js"></script> // 魔窗app唤起 new Mlink({ mlink:'https://ahv8ke.mlinks.cc/ABCD', //短链地址,ABCD为短链KEY button:document.querySelector('#btn'), // 某点击唤起按钮 params: { schemeurl: encodeURIComponent(''), //传给app的参数 } })
3.vue组件中css:
<style scoped> // Add "scoped" attribute to limit CSS to this component only
4.一些js小技巧:
Array.prototype.slice.call( arguments ):类数组对象转 => 数组 === ES6中Array.from( arguments )方法
Object.prototype.toString.call():检验js数据类型,比typeof更严谨
Array.prototype.slice(): copy数组 === es6展开运算符[...arr]
5.在微信中打开h5页面,阻止微信touch默认事件:
document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false) // 阻止浏览器默认的touch函数方法
可用iscroll.js写的touch事件
6.Hybrid开发js调用native组件总结:
1.创建全局对象bridge,具有call(调用native方法)和register(可传callback,托管native某些方法)两个属性
2.分别获取ios或者安卓的bridge(分别用的github上的WebViewJavascriptBridge和jsBridge桥梁)
3.根据环境暴露bridge object,把从ios或者安卓获取的callHandler和registerHandler传给全局bridge对象
WebViewJavascriptBridge具体实现方法:
1.iOS可用iframe做请求,url:://native函数名?参数
2..安卓则可以通过webview.addJavascriptInterface方法把方法注入到window上
调取第三方登录的过程:
授权网络标准:OAuth