js与移动端交互

1.js 调用移动端ios与android方法

2.移动端ios与android调用js方法

3.demo如下:

<!DOCTYPE html>
<html>
    <head>
        <title>js与移动端交互</title>
        <meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0">
        <meta charset="UTF-8">
            </head>
    <body>
    	
    	<div id="btt" style="text-align:center;margin-top:200px;">
    		<input type="button" name="" id="getData" value="调用移动端app内定义方法" style="font-size: larger;" />
    	</div>
  	
    </body>
    <script type="text/javascript" charset="utf-8">
    	document.getElementById("getData").addEventListener("click", function(){
    		var data={"a":"1","b":"2"}
    		//method为移动端原生方法的方法名,param为要传递的参数
			//window.webkit.messageHandlers.method.postMessage(param)
			if (_IsIOS()) {
				alert("进入ios")
				try
				   {
					 window.webkit.messageHandlers.test.postMessage(JSON.stringify(data))
					}
				 catch(err)
				   {
				   //在这里处理错误
				   alert("调用异常:"+err)
				   return;
				   }
			    alert("调用完成")
			} else if (_IsAndroid()) {
				alert("进入android")
			    // var s= window.control.call('test()', data);
			    //或者window.control.method(param);
			   
			   try
				   {
				   //在这里运行代码
				     window.YouXun_JS.test(JSON.stringify(data))
				   }
				 catch(err)
				   {
				   //在这里处理错误
				   alert("调用异常:"+err)
				   return;
				   }
			    alert("调用完成")
			}

    	})
    	//移动端调用js方法
    	function testCall(data) {
		    alert(data);
		    
		}
	
    	
    	
		    	
		//判断是否为ios端访问
		function _IsIOS() {
		    if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
		        return true;
		    } else {
		        return false;
		    }
		}
		//判断是否为android端访问
		function _IsAndroid() {
		    if (/(Android|Adr)/i.test(navigator.userAgent)) {
		        return true;
		    } else {
		        return false;
		    }
		}

    </script>
</html>

 

©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页
实付 39.90元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值