美文网首页
h5 和 web交互 html demo

h5 和 web交互 html demo

作者: LeeDev | 来源:发表于2018-07-11 17:22 被阅读263次
<!DOCTYPE html>
<html>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <meta name="viewport" content="width=device-width,target-densitydpi=high-dpi,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
        <head>
            <title></title>
            <script type="text/javascript">
            //本方法兼容安卓与iOS
            function callMobile(handlerInterface,handlerMethod,parameters){
                //handlerInterface由iOS addScriptMessageHandler与andorid addJavascriptInterface 代码注入而来。
                var dic = {'handlerInterface':handlerInterface,'function':handlerMethod,'parameters': parameters};
                
                if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)){
                    window.webkit.messageHandlers[handlerInterface].postMessage(dic);
                }else{
                    //安卓传输不了js json对象
                    window[handlerInterface][handlerMethod](JSON.stringify(dic));
                }
            }
            function callMobileNative(handlerMethod,parameters){
                callMobile("Native",handlerMethod,parameters);
            }
            </script>
        </head>
        <body>
            <br>
            <input type="button" value="传个字典" onclick="callMobile('Native','iosFunc',{'param1':76,'param2':155,'param3':76})" />
            <input type="button" value="传个字典2" onclick="callMobileNative('iosFunc2',{'param1':76,'param2':155,'param3':76})" />
        </body>
</html>

相关文章

网友评论

      本文标题:h5 和 web交互 html demo

      本文链接:https://www.haomeiwen.com/subject/iwzhpftx.html