在开始之前，首先需要登录百度地图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. 解决dom4j加载xml文件性能慢的问题

    在代码中使用: 1: DocumentHelper.parseText 2: SAXReader reader = new SAXReader(); Document extdocument = re ...

  2. 瀑布流布局js

    <!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content=& ...

  3. python链家网高并发异步爬虫and异步存入数据

    python链家网二手房异步IO爬虫,使用asyncio.aiohttp和aiomysql 很多小伙伴初学python时都会学习到爬虫,刚入门时会使用requests.urllib这些同步的库进行单线 ...

  4. python 深浅拷贝&集合

    一.深浅拷贝 1.浅拷贝,只会拷贝第一层 s = [1, 'ss', '小可爱'] s1 = s.copy() print(s1) >>> [1, 'ss', '小可爱'] s = ...

  5. vim学习之旅01-文本搜索并高亮显示

    step 1:在linux终端新建一个test.txt文本文档:vim test.txt; 回车后打开编辑器: step 2:进入编辑状态(键盘"i")输入一段文本,退出编辑(键盘 ...

  6. 【转】WEB前端调优

    首先从一次完整的的请求说起:(以此为例get,www,baidu.com) 1,webbrower 发出request, 2,然后解析www.baidu.com为ip,找到ip的服务器, 3,服务器处 ...

  7. centos7安装mysql5.7.19及配置远程连接

    centos7安装mysql5.7.19及配置远程连接------https://blog.csdn.net/Lh19931122/article/details/77996213

  8. 用java实现二分搜索<算法分析>

    实验目的:1.复习java编程:2.掌握二分搜索技术的基本原理:3.掌握使用java程序进行二分搜索的方法.实验步骤:1.由用户输入5个以上的整数:2.利用二分搜索算法完成对数组的搜索. packag ...

  9. 全文搜索（A-5）-推荐算法

    基于内容的推荐算法: 协同过滤推荐算法: 混合推荐算法: 基于内容的推荐算法做了如下假设:用户会喜欢和原来喜欢的物品相类似的项目.

  10. HDU 4745 最长回文子序列

    题目大意 两只青蛙朝不同方向条,每次都到达值相同的位置,不能重复到达自己到过的地方,且不能飞跃已到过的地方 我们可以理解为这两只青蛙分别把整个序列遍历了一遍,依次走过所有的点,找到最多相同的点的个数, ...