H5 调起手机短信电话，调起应用，使用定位

参考资源

blog.csdn.net/zhangjing03… blog.csdn.net/weixin_3408…

调起手机短信电话

1.调起手机短信

JS

   // 浏览器的用户代理报头
  let u = navigator.userAgent;
  let smsurl = '';
  // 短信内容需要转码
  smstextArea = encodeURIComponent(textArea)
  if(/(iPhone|iPad|iPod|iOS)/i.test(u))
  {
    smsurl = `sms:${customerPhone}&body=${smstextArea}`
  }else{
    smsurl = `sms:${customerPhone}?body=${smstextArea}`
  }

HTML

<!--Andriod-->
<a href="sms:131***?body=我是短信内容">发送短信</a>
<!--IOS-->
<a href="sms:131***&body=我是短信内容">发送短信</a>
<!--在URL最后面加“ #mp.weixin.qq.com ”。 例如公司简介的页面是：http://app.xxxxx.com/about.html#mp.weixin.qq.com ，那么这个页面里面的 tel:都能正常跳到拨号界面了-->

自己写的部分

<a id="sms" href="sms:10086&body=发件人:xx短信内容:xx地址:xx">发送短信</a>

 // 浏览器的用户代理报头 用于判断当前客户端
let u = navigator.userAgent;
// 电话号码
const customerPhone = "12312312312"
// 短信内容
const textArea = "A:" + "\n" + "B:" + "\n" + "C:"
// 转码后的短信内容
let smstextArea;
// 最后a标签的url
let smsurl = '';
// 短信内容需要转码 可支持换行
smstextArea = encodeURIComponent(textArea)
// ios和Android的短信发送不一致 &和?
if(/(iPhone|iPad|iPod|iOS)/i.test(u))
{
    smsurl = `sms:${customerPhone}&body=${smstextArea}`
}else{
    smsurl = `sms:${customerPhone}?body=${smstextArea}`
}
// 模拟点击发送
let aEl =  document.getElementById("sms")
aEl.href = smsurl

window.location.href = smsurl

调起应用

www.jianshu.com/p/21380058d…

使用定位

<div id="baidu"></div>
    <div id="google_geo"></div>
    <script>
        function getLocation(){ 
            if (navigator.geolocation){ 
                navigator.geolocation.getCurrentPosition(showPosition,showError); 
            }else{ 
                alert("浏览器不支持地理定位。"); 
            } 
        }
        function showPosition(position){
            //将我们获取到的经纬度保存到变量中
            var latlon = position.coords.latitude+','+position.coords.longitude; 
            
            //baidu接口
            var url = "http://api.map.baidu.com/geocoder/v2/?ak=C93b5178d7a8ebdb830b9b557abce78b&callback=renderReverse&location="+latlon+"&output=json&pois=0" 
            $.ajax({ 
                type: "GET", 
                dataType: "jsonp", 
                url: url, 
                beforeSend: function(){ 
                    $("#baidu").html('正在定位...'); 
                }, 
                success: function (data) { 
                    if(data.status==0){ 
                        $("#baidu").html(data.result.formatted_address); 
                    } 
                    }, 
                    error: function (XMLHttpRequest, textStatus, errorThrown) { 
                    $("#baidu").html(latlon+"地址位置获取失败"); 
                } 
            });
            var  googleUrl ='http://maps.google.cn/maps/api/geocode/json?latlng='+latlon+'&language=CN';
            $.ajax({
                type: "GET",
                dataType: "jsonp",
                url: googleUrl,
                success: function (data) { 
                    if(data.status=='OK'){ 
                        var results = data.results; 
                        $.each(results,function(index,array){ 
                            if(index==0){ 
                                $("#google_geo").html(array['formatted_address']); 
                            } 
                        }); 
                    } 
                }
            })
        }
        function showError(error){ 
            switch(error.code) { 
                case error.PERMISSION_DENIED: 
                alert("定位失败,用户拒绝请求地理定位"); 
                break; 
                case error.POSITION_UNAVAILABLE: 
                alert("定位失败,位置信息是不可用"); 
                break; 
                case error.TIMEOUT: 
                alert("定位失败,请求获取用户位置超时"); 
                break; 
                case error.UNKNOWN_ERROR: 
                alert("定位失败,定位系统失效"); 
                break; 
            } 
        }
        getLocation()
    </script>