在开始之前,首先需要登录百度地图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. Python tldextract模块

    最新发布的 PyPI: pip install tldextract 或者最新的开发版本: pip install -e 'git://github.com/john-kurkowski/tldext ...

  2. XP禁用了U盘和移动硬盘方法

    会不会是你XP禁用了U盘和移动硬盘下面这些是任何禁用U盘的!你自己反着试下嘛!方法一,BIOS设置法(快刀斩乱麻法) 进入BIOS设置,选择“Integrated Peripherals”选项,展开后 ...

  3. tensorflow 学习笔记-- tf.reduce_max、tf.sequence_mask

    1.tf.reduce_max函数的作用:计算张量的各个维度上的元素的最大值.例子: import tensorflow as tfmax_value = tf.reduce_max([1, 3, 2 ...

  4. python中的句柄操作

    python中的句柄操作 制作人:全心全意 通过窗口标题获取句柄 import win32gui hld = win32gui.FindWindow(None,u"Adobe Acrobat ...

  5. Python:os模块 time模块

    1.os os.popen('cmd').read() 执行某个系统命令,:输出命令结果 os.getcwd()  获取当前操作目录 os.makedirs(r"C:\a\b\c" ...

  6. 如何设置路由器的MTU

    前几天搞了个ER-X,总觉得没有发挥其最大的能力.今天查了下如何设置MTU,罗列如下,备忘. 1. 目前都是PPPOE,这个不管网络如何复杂,均不要在路由后面计算封包大小.正确的是电脑直接连猫,直接拔 ...

  7. 杭电 2803 The MAX(sort)

    Description Giving N integers, V1, V2,,,,Vn, you should find the biggest value of F.  Input Each tes ...

  8. First C program

    come from https://mooc.study.163.com/learn/1000002011?tid=2001530003#/learn/content?type=detail& ...

  9. 【04】emmet系列之编辑器

     [01]emmet系列之基础介绍 [02]emmet系列之HTML语法 [03]emmet系列之CSS语法 [04]emmet系列之编辑器 [05]emmet系列之各种缩写 前端开发人员,常用的是s ...

  10. 【Codeforces 1041D】Glider

    [链接] 我是链接,点我呀:) [题意] 题意 [题解] 二分. 枚举每一个上升区的起始位置作为起点(这样做肯定是最优的),然后如果没有掉在地上的话就尽量往右二分(只有上升区之间的间隙会让他往下掉) ...