laravel inopt框定位地理位置

    <div class="layui-form-item">
        <label class="layui-form-label">地址</label>
        <div class="layui-input-block">
            <input type="text" name="address"  id="address" placeholder="请输入" autocomplete="off" onclick="map()" class="layui-input">
        </div>
    </div>

<script type="text/javascript">
    function map() {
        $.ajax({
            type: "get",//接口规定，只能用get
            async: true,//异步
            url: "https://apis.map.qq.com/ws/location/v1/ip",//接口地址
            data: {"key": "腾讯地图的key", "output": "jsonp"},//参数格式必须用到output传参为jsonp，否则会报跨域问题
            dataType: "jsonp",//跨域，必须用到jsonp
            success: function (result) {
                // console.log(result.message)  ;
                // console.log(result.result.ad_info)  ;
                //    进行追加至input
                $('#address').val(result.result.ad_info.nation+'/'+result.result.ad_info.province+'/'+result.result.ad_info.city)
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                console.log(JSON.stringify(XMLHttpRequest));
                document.write(JSON.stringify(XMLHttpRequest));
            }
        });
    }

</script>

获取腾讯地图的key

https://lbs.qq.com/dev/console/application/mine

效果图

标签：laravel,info,console,ad,地理位置,inopt,result,jsonp,XMLHttpRequest
来源： https://www.cnblogs.com/xiaoyantongxue/p/16071081.html