今年的项目开发中,初步接触了移动端web开发,也就边学习html5边开发,主要使用了jquery mobile技术,发现这个不适合做互联网产品,大部分样式都需要重写,只用了部分功能。手机端web开发过程中第一次接触了定位功能,通过各大搜索引擎发现手机端定位都是通过浏览器的定位,而用在pc端浏览器第一次会弹出提示“是否开启定位功能”,boss看到这个提示,却觉得对用户的体验效果不好,不好那我换一种方式实现不就好了,这又不是多大的事,而boss的脸色就大变,就说:不应该有这样的体验。我们这样做不都是为了赶时间,能够尽快将新功能发布嘛。
1.手机web定位方法:
复制代码 代码如下:
var getlocation = function (successfunc, errorfunc) { //successfunc获取定位成功回调函数,errorfunc获取定位失败回调
//首先设置默认城市
var defcity = {
id: '000001',
name: '北京市',
date: curdatetime()//获取当前时间方法
};
//默认城市
$.cookie('vpiao_mobile_defaultcity', json.stringify(defcity), { expires: 1, path: '/' });
if (navigator.geolocation) {
navigator.geolocation.getcurrentposition(function (position) {
var lat = position.coords.latitude;
var lon = position.coords.longitude;
//var map = new bmap.map(container); // 创建map实例
var point = new bmap.point(lon, lat); // 创建点坐标
var gc = new bmap.geocoder();
gc.getlocation(point, function (rs) {
var addcomp = rs.addresscomponents;
var curcity = {
id: '',
name: addcomp.province,
date: curdatetime()
};
//当前定位城市
$.cookie('vpiao_mobile_currentcity', json.stringify(curcity), { expires: 7, path: '/' });
//alert(addcomp.province + , + addcomp.city + , + addcomp.district + , + addcomp.street);
if (successfunc != undefined)
successfunc(addcomp);
});
},
function (error) {
switch (error.code) {
case 1:
alert(位置服务被拒绝。);
break;
case 2:
alert(暂时获取不到位置信息。);
break;
case 3:
alert(获取位置信息超时。);
break;
default:
alert(未知错误。);
break;
}
var curcity = {
id: '000001',
name: '北京市',
date: curdatetime()
};
//默认城市
$.cookie('vpiao_mobile_defaultcity', json.stringify(curcity), { expires: 1, path: '/' });
if (errorfunc != undefined)
errorfunc(error);
}, { timeout: 5000, enablehighaccuracy: true });
} else {
alert(你的浏览器不支持获取地理位置信息。);
if (errorfunc != undefined)
errorfunc(你的浏览器不支持获取地理位置信息。);
}
};
var showposition = function (position) {
var lat = position.coords.latitude;
var lon = position.coords.longitude;
//var map = new bmap.map(container); // 创建map实例
var point = new bmap.point(lon, lat); // 创建点坐标
var gc = new bmap.geocoder();
gc.getlocation(point, function (rs) {
var addcomp = rs.addresscomponents;
var curcity = {
id: '',
name: addcomp.province,
date: curdatetime()
};
//当前定位城市
$.cookie('vpiao_mobile_currentcity', json.stringify(curcity), { expires: 7, path: '/' });
//alert(addcomp.province + , + addcomp.city + , + addcomp.district + , + addcomp.street);
});
};
var showpositionerror = function (error) {
switch (error.code) {
case 1:
alert(位置服务被拒绝。);
break;
case 2:
alert(暂时获取不到位置信息。);
break;
case 3:
alert(获取位置信息超时。);
break;
default:
alert(未知错误。);
break;
}
var curcity = {
id: '000001',
name: '北京市',
date: curdatetime()
};
//默认城市
$.cookie('vpiao_mobile_defaultcity', json.stringify(curcity), { expires: 1, path: '/' });
};
前提要引入百度api:
2.pc端通过ip实现方法:
采用腾讯提供的接口,这个目前已经不能使用了
复制代码 代码如下:
>http://fw.qq.com/ipaddress>>
采用新浪接口: http://int.dpool.sina.com.cn/iplookup/iplookup.php?format=js
多地域测试方法:http://int.dpool.sina.com.cn/iplookup/iplookup.php?format=js&ip=127.0.0.1
复制代码 代码如下:
网易有道ip地址接口(这个有待测试)
http://www.youdao.com/smartresult-xml/search.s?type=ip&q=ip地址
淘宝请求接口(get)
复制代码 代码如下:
太平洋ip地址库api接口
http://whois.pconline.com.cn/?ip=[ip地址字符串]
另外:还有google、搜狐等提供对应的接口,大家可以自己试一试。
搜狐ip地址查询接口(默认gbk):http://pv.sohu.com/cityjson
搜狐ip地址查询接口(可设置编码):http://pv.sohu.com/cityjson?ie=utf-8
搜狐另外的ip地址查询接口:http://txt.go.sohu.com/ip/soip
3.获取客户端ip方法
复制代码 代码如下:
今天就写到这吧,还有好多工作需要去完成,等有时间了可以试试其它接口。欢迎大家来拍砖,提供更好的方法。