jQuery通过地址获取经纬度demo
在开始之前,首先需要登录百度地图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的更多相关文章
- jQuery根据地址获取经纬度
一.HTML部分 1 @*景区位置*@ 2 <tr> 3 <th>景区名称:</th> 4 <td><input class="txt ...
- 百度地图api根据地址获取经纬度
package com.haiyisoft.cAssistant;import java.io.BufferedReader;import java.io.IOException; import ja ...
- 利用百度API(js),怎样通过地址获取经纬度
根据经纬度找到具体地址:http://api.map.baidu.com/geocoder?location=纬度,经度&output=输出格式类型&key=用户密钥如:http:// ...
- JS 通过选择百度地图地址获取经纬度自动填充到文本框中的方法
首先要注册百度地图API. 1.登录百度地图开放平台http://lbsyun.baidu.com 注册账号,完善信息,点击网站右上角的“API控制台”,点击,创建应用. 应用类型选择:“浏览器端”, ...
- 利用百度API(js),通过地址获取经纬度的注意事项
网上给的很多答案都是这种: http://api.map.baidu.com/geocoder?address=地址&output=输出格式类型&key=用户密钥&city=城 ...
- Java 通过地址获取经纬度 - 高德地图
一.添加依赖 <dependency> <groupId>org.hibernate</groupId> <artifactId>hibernate-v ...
- Python 根据地址获取经纬度
方法一: 使用Geopy包 : https://github.com/geopy/geopy (仅能精确到城镇,具体街道无结果返回) from geopy.geocoders import Nom ...
- Python 根据地址获取经纬度及求距离
方法一: 使用Geopy包 : https://github.com/geopy/geopy (仅能精确到城镇,具体街道无结果返回) from geopy.geocoders import Nom ...
- Android Google Maps API 网络服务用于网络定位、计算路线、获取经纬度、获取详细地址等
extends:http://blog.csdn.net/h7870181/article/details/12505883 Google Maps API 网络服务 官网地址 : https://d ...
随机推荐
- 2018湖南省第14届大学生计算机程序设计竞赛 A字符画
Description 读入 w,请输出 2018 的字符画,两个数字之间有 w 个空格.具体格式请参考样例输出. 1 ≤ w ≤ 2018 Input 输入文件只包含 1 个整数 w. Output ...
- linux纯字符界面不支持中文
[2017-01-17] linux纯字符界面不支持中文
- Python之游戏开发-飞机大战
Python之游戏开发-飞机大战 想要代码文件,可以加我微信:nickchen121 #!/usr/bin/env python # coding: utf-8 import pygame impor ...
- 全国高校json数据包(复python解析代码)
由于这段时间需要有关学校的三级联动插件,找了很久没有找到合适的,所以去教育部官网下载了一份全国普通高校名单(2019年), 这里附上解析该xls文件的代码 import xlrd import jso ...
- Python数据类型之数字类型
整数 在Python中,整数可以执行 加(+)减(-)乘(*)除(/) 运算. 1 + 2 3 - 2 2 * 3 3 / 2 # 1.5 在控制台,Python直接返回运算结果. Python中也可 ...
- 集训第四周(高效算法设计)O题 (构造题)
A permutation on the integers from 1 to n is, simply put, a particular rearrangement of these intege ...
- 24L01-2.4G无线传输模块调节记录
在调试24L01的时候,虽然能用到别人的程序,但仅仅是程序的初始化,并没有告诉我们如何去后续的操作,如何去再次发送一组数.最近调试24L01接近尾声,将逐一的地方总结下来,以便以后查阅,也供其他人借鉴 ...
- Python接口测试之对MySQL的操作(六)
本文章主要来说python对mysql数据库的基本操作,当然,前提是已经搭建了python环境和搭建了Mysql 数据库的环境,python操作mysql数据库提供了MySQLdb库,下载的地址为: ...
- HDU 1016 素数环问题
题目大意: 给定1-n这n个数,组成以1开头的素数环,保证相邻两个数相加均为素数 题目用dfs搜索再回溯,这样碰到不成立的立刻退出递归,就减少了很多步骤,不然暴力来就是n!次复杂度,肯定是超时的 每次 ...
- [luoguP1877] [HAOI2012]音量调节(DP)
传送门 绝世傻DP #include <cstdio> #include <iostream> #define N 51 int n, s, mx; bool f[N][100 ...