在开始之前,首先需要登录百度地图API控制台申请密钥ak。

1、登录百度地图开放平台http://lbsyun.baidu.com

注册账号,完善信息,点击网站右上角的“API控制台”,点击,创建应用。

应用类型选择:“服务器端”,IP白名单:0.0.0.0/0

点击提交。会生成一个访问应用(AK)。

2、编写界面。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<meta name="robots" content="noindex, nofollow">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<!-- 引入jquery-->
<script src="./js/jquery-1.7.2.min.js"></script>
</head>
<body>
address:<input type="text" name="address" id="address" style="width:30%">
      <br>
point:<input type="text" name="point" id="point" style="width:30%" readonly>
<button type="button" id="open">getPoint</button>
</body>
</html>

3.核心方法

 <script type="text/javascript">
document.getElementById('open').onclick = function () {
var addressStr = $("#address").val();
if(addressStr!=""){
$.ajax({
url: "http://api.map.baidu.com/geocoder/v2/",
data: {"address": addressStr, "output":"json", "ak":"刚才你申请的ak"},
type: "post",
dataType:'JSONP',
success :function(data){
var lng = data.result.location.lng;
var lat = data.result.location.lat;
$("#point").val(lng+","+lat);
}
}); }else{
alert("addres is not null!");
}
}
</script>

4.效果展示:

当没有输入地址,提示:

jQuery通过地址获取经纬度demo的更多相关文章

  1. jQuery根据地址获取经纬度

    一.HTML部分 1 @*景区位置*@ 2 <tr> 3 <th>景区名称:</th> 4 <td><input class="txt ...

  2. 百度地图api根据地址获取经纬度

    package com.haiyisoft.cAssistant;import java.io.BufferedReader;import java.io.IOException; import ja ...

  3. 利用百度API(js),怎样通过地址获取经纬度

    根据经纬度找到具体地址:http://api.map.baidu.com/geocoder?location=纬度,经度&output=输出格式类型&key=用户密钥如:http:// ...

  4. JS 通过选择百度地图地址获取经纬度自动填充到文本框中的方法

    首先要注册百度地图API. 1.登录百度地图开放平台http://lbsyun.baidu.com 注册账号,完善信息,点击网站右上角的“API控制台”,点击,创建应用. 应用类型选择:“浏览器端”, ...

  5. 利用百度API(js),通过地址获取经纬度的注意事项

    网上给的很多答案都是这种: http://api.map.baidu.com/geocoder?address=地址&output=输出格式类型&key=用户密钥&city=城 ...

  6. Java 通过地址获取经纬度 - 高德地图

    一.添加依赖 <dependency> <groupId>org.hibernate</groupId> <artifactId>hibernate-v ...

  7. Python 根据地址获取经纬度

    方法一: 使用Geopy包 : https://github.com/geopy/geopy   (仅能精确到城镇,具体街道无结果返回) from geopy.geocoders import Nom ...

  8. Python 根据地址获取经纬度及求距离

    方法一: 使用Geopy包 : https://github.com/geopy/geopy   (仅能精确到城镇,具体街道无结果返回) from geopy.geocoders import Nom ...

  9. Android Google Maps API 网络服务用于网络定位、计算路线、获取经纬度、获取详细地址等

    extends:http://blog.csdn.net/h7870181/article/details/12505883 Google Maps API 网络服务 官网地址 : https://d ...

随机推荐

  1. Linux C动态链接库实现一个插件例子

    实现一个简单的计算动态链接库:升级动态链接库后,在不重新编译主程序的情况下,直接生效. lib库: #cat math.c #include <stdio.h> int add(int x ...

  2. OBJECTPROPERTY用法整理

    OBJECTPROPERTY用法整理 分类: 系统表与表结构 数据库管理维护2010-06-03 16:37 2783人阅读 评论(1) 收藏 举报 数据库sql serverinsertobject ...

  3. linux下查找字符串的命令

    1. set命令可以显示出当前shell下所有全局参量定义及其值;   2. 查找并删除当前目录下小文件: find . -type f -size -10k -exec rm {} \; 说明: w ...

  4. 18mybatis

    18mybatis-2018/08/02 1.mybatis标签 定义SQL语句 id :唯一的标识符 parameterType:传给此语句的参数的全路径名或别名例:com.test.poso.Us ...

  5. ProtoBuf - Arena

    1.概述 最近看 Protocal Buffer 的源码,初次见到这个库源自陈硕的 muduo ,便打算看一看,在此做一下记录.官网文档不能访问,只能凭借代码的自己理解,查看的源码版本为 3.6.0. ...

  6. HDU—4463 Outlets 最小生成树

    In China, foreign brand commodities are often much more expensive than abroad. The main reason is th ...

  7. CSU1011: Counting Pixels

    Description Did you know that if you draw a circle that fills the screen on your 1080p high definiti ...

  8. 查看用户的信息文件-passwd

    passwd 文件 位置:/etc/passwd 作用:用于保存用户的账户信息 注意点:由于passwd也可以作为一个命令直接使用,也可以作为配置文件,所以如果使用man命令进行查看帮助信息时,应该有 ...

  9. [Python3网络爬虫开发实战] 3.1.1-发送请求

    使用urllib的request模块,我们可以方便地实现请求的发送并得到响应,本节就来看下它的具体用法. 1. urlopen() urllib.request模块提供了最基本的构造HTTP请求的方法 ...

  10. [Python3网络爬虫开发实战] 3.1.2-处理异常

    前一节我们了解了请求的发送过程,但是在网络不好的情况下,如果出现了异常,该怎么办呢?这时如果不处理这些异常,程序很可能因报错而终止运行,所以异常处理还是十分有必要的. urllib的error模块定义 ...