在开始之前，首先需要登录百度地图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. 为什么 [\000-\177]匹配任意7bit ascii码 ？

    如题 41     print \000;     42     print "\n";     43     print \177; 输出: SCALAR(0x3fce0)SCA ...

  2. 一、认识spring框架

    对于spring框架,作为Java开发人员肯定不陌生,大名鼎鼎,名声在外,但是对于spring框架没有进行过系统的学习,从今天开始学习并且记录一下spring框架的比较牛逼的特性. 一.spring简 ...

  3. CodeForces - 1020C C - Elections(贪心+枚举)

    题目: 党派竞争投票 有n个人,m个党派,这n个人每个人有一个想要投的党派的编号Pi,如果想要这个人改变他的想法,那么就需要花费Ci元钱. 现在你是编号为1的党派,如果你想要赢(你的票数严格大于其他党 ...

  4. [kuangbin带你飞]专题四 最短路练习

    对于最短路,我主要使用的就是dijkstra,Floyd,SPFA这三个算法.先来介绍一下这三个算法. 1. dijkstra算法.它适用于边权为正的情况,它是单源最短路,就是从单个源点出发到所有的结 ...

  5. SVN CommandLine

    要是SVN命令行用不了的话: 1.SVN装了没? 2.SVN安装时,选项“command line client tools”选了没. 检出: svn checkout [-depth ARG] [- ...

  6. 根据Dockerfile创建hello docker镜像

    一.编写hello可执行c文件: 1.安装:gcc glibc glibc-static yum install -y gcc glibc glibc-static 2.编写hello.c:vim h ...

  7. 分分钟钟学会Python - 文件操作

    文件操作 1 文件基本操作 obj = open('路径',mode='模式',encoding='编码') obj.write() # 写入 obj.read() # 读取 obj.close() ...

  8. Spider-Python爬虫之使用Selenium模拟浏览器行为

    分析 他的代码比较简单,主要有以下的步骤:使用BeautifulSoup库,打开百度贴吧的首页地址,再解析得到id为new_list标签底下的img标签,最后将img标签的图片保存下来. header ...

  9. Leetcode 213.大家劫舍II

    打家劫舍II 你是一个专业的小偷,计划偷窃沿街的房屋,每间房内都藏有一定的现金.这个地方所有的房屋都围成一圈,这意味着第一个房屋和最后一个房屋是紧挨着的.同时,相邻的房屋装有相互连通的防盗系统,如果两 ...

  10. POJ-2594 Treasure Exploration floyd传递闭包+最小路径覆盖，nice！

    Treasure Exploration Time Limit: 6000MS   Memory Limit: 65536K Total Submissions: 8130   Accepted: 3 ...