【IT专家】高德地图 javascript 输入提示后查询

合集下载

利用高德地图javascriptAPI做一个自己的地图

利⽤⾼德地图javascriptAPI做⼀个⾃⼰的地图最近由于项⽬中需要制作⼀个地图，⽤来选择活动地点，我就花了两天利⽤⾼德地图的javascriptAPI⾃制了⼀个地图的demo。

在这了记录⼀下我学习的过程。

⼀、进⼊官⽹，再找到⾼德地图的开放平台，我是做前端的，所以使⽤的是。

地图的功能很多，使⽤API可以⾃⼰定制⾃⼰想要的功能。

在使⽤前需要⾃⼰申请⼀个Key，引⼊API的时候会⽤到这个key。

⼆、详细看⼀下左边的那⼀列各个⾥⾯的内容，看完了基本就知道怎么回事了，它提供的javascriptAPI其实就是⼀个接⼝，调⽤它的相应的接⼝就可以得到⾃⼰需要的数据。

⾄于怎么调⽤接⼝，⾥⾯都讲的很清楚。

三、我觉得最有⽤，上⼿最快的位置还是那个实例中⼼，⾥⾯有很多不同的例⼦。

基本能满⾜各种简单需求，我把其中的三个综合了⼀下，就实现了我想要的基本功能。

下⾯是完整的代码页⾯，复制下来保存为html就可以看到我的那个效果了。

（代码后⾯有张截图，可以看下效果）<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>输⼊提⽰后查询</title><style type="text/css">/************************* Just Reset Browser Default CSS : BEGIN ***************************/html {background-color: #fff;}body, div, h1, h2, h3, h4, ul, li, form, input, dl, dt, dd, p {margin: 0;padding: 0;font-family: "微软雅⿊";}h3 {+ font-size : 14 px;_font-size: 14px;}img {border: none;}.c {clear: both;}ul, ol, li {list-style: none;}/*清除浮动*/.clearfix:after {content: ".";visibility: hidden;display: block;height: 0;overflow: hidden;clear: both;}/* no ie mac \*/* html .clearfix {height: 1%;}/* end */* + html .clearfix {height: 1%;}body {font: 12px / 1.5em 微软雅⿊, Arial, Verdana, Helvetica, sans-serif;color: #333;}button, input, select, textarea {color: #999;}input[type="button"] {padding: 0 5px;color: #333;}.demo_box {float: left;width: 620px;height: 500px;}/* map style */#iCenter {float: left;width: 650px;height: 500px;margin-left: 5px;margin-right: 10px;border: 1px solid #F6F6F6;}#r_title {line-height: 28px;padding-left: 5px;background-color: #D1EEEE;font-weight: bold;}#result {overflow: auto;margin-bottom: 5px;/* width:661px;height: 255px;*/}/* 结果项 */#result .sub_result {font-size: 12px;/*padding:0px 0 4px 2px;*/border-bottom: 1px solid #C1FFC1;}#result .sub_result .detail {}#result .sub_result .detail h3 {color: #00A6AC;}a {color: #067EC0;text-decoration: none;}a:hover {text-decoration: underline;}.note {color: #999;}/*** layerout stylesheet ***//* 修改背景URL */div.change {background-image: url(/20110909/img/map/marker-h.png); }div.change div {background-image: url(/20110909/img/map/marker-h-l.gif); }/*** copied from demo #39 添加⾃定义点覆盖物 ***//* 定义⾃定义点样式 */.markerContentStyle {position: relative;}.markerContentStyle span {background-color: #FFFFFF;color: #FF1493;width: 120px;heigth: 80px;border: 2px solid #D8BFD8;FONT-FAMILY:华⽂⾏楷;position: absolute;top: -10px;left: 25px;white-space: nowrap -webkit-border-radius : 5 px;border-radius: 5px;}/*** copied from demo #43 添加⾃定义信息窗体 ***//* 定义⾃定义信息窗体样式 */ {position: relative;z-index: 100;border: 1px solid #BCBCBC;box-shadow: 0 0 10px #B7B6B6;border-radius: 8px;background-color: rgba(255, 255, 255, 0.9);transition-duration: 0.25s;}:hover {box-shadow: 0px 0px 15px #0CF;}-top {position: relative;background: none repeat scroll 0 0 #F9F9F9;border-bottom: 1px solid #CCC;border-radius: 5px 5px 0 0;}-top div {display: inline-block;color: #333333;font-size: 14px;font-weight: bold;line-height: 31px;padding: 0 10px;}-top img {position: absolute;top: 10px;right: 10px;transition-duration: 0.25s;}-top img:hover {box-shadow: 0px 0px 5px #000;}-middle {font-size: 12px;padding: 10px;line-height: 21px;}-bottom {height: 0px;width: 100%;clear: both;text-align: center;}-bottom img {position: relative;z-index: 104;}input.inputTextStyle{width: 400px;height: 24px;font-size: 16px;margin: 5px;padding: 2px;input.btn{color: #000000;height: 30px;font-size: 16px;margin: 5px;padding: 2px;display:inline;}b.b_text{font-size: 16px;margin: 5px 0px 5px 10px;_padding-bottom:2px;_margin-left: 20px;_margin-bottom: 10px;*padding-bottom:2px;*margin-bottom: 10px;display:inline;*width:1;width: auto;overflow: auto;*overflow:visible;zoom:1;}/*** -------------------------***/</style></head><body><div><b class="b_text">活动地点：</b><input id="aim" class="inputTextStyle" type="text"/><input class="btn" type="button" value="在地图上选择" onclick="showMap();"/></div><div id="mapBg" style="position: absolute;display: none;"><div id="iCenter"></div><div class="demo_box"><div><b class="b_text">请输⼊搜索关键字：</b><input id="keyword" onkeyup="keydown();" class="inputTextStyle" type="text"/><div id="result1" name="result1" style="overflow: auto; width: 95%; border: 1px solid gray;display: none;"></div> </div><div id="r_title"><b>查询结果:</b></div><div id="result"></div></div></div><script language="javascript" src="/maps?v=1.3&key=608d75903d29ad471362f8c58c550daf"></script> <script language="javascript">var mapObj; //地图对象var lnglatXY; //当前对象坐标var aimAddress; //当前对象地址var geocoderMarker = undefined; //逆编码跟随⿏标移动视图var searchMarker = []; //搜索结果信息标记var windowsArr = []; //搜索结果地图信息var addressArr = []; //搜索结果地址集合function showMap(){ //显⽰地图var self = this;var mapEle = document.getElementById("mapBg");mapEle.style.display = "block";self.mapInit();}function makeSure(){ //点击确认var self = this;var aim = document.getElementById("aim");aim.value = aimAddress || "";}function mapInit() { //创建地图并绑定监听事件var self = this;mapObj = new AMap.Map("iCenter", {view: new AMap.View2D({//center:new AMap.LngLat(116.397428,39.90923),//地图中⼼点zoom: 12 //地图显⽰的缩放级别})});var listener = AMap.event.addListener(mapObj, "click", function (e) {mapObj.clearMap(); // 清楚所有覆盖物lnglatXY = e.lnglat;var listenMarker = new AMap.Marker({map: mapObj,position: e.lnglat,icon: "/images/0.png",offset: new AMap.Pixel(-10, -34)});mapObj.setCenter(lnglatXY);self.geocoder();});}function geocoder() { //通过坐标找到具体地址var MGeocoder;//加载地理编码插件mapObj.plugin(["AMap.Geocoder"], function () {MGeocoder = new AMap.Geocoder({radius: 1000,extensions: "all"});//返回地理编码结果AMap.event.addListener(MGeocoder, "complete", geocoder_CallBack);//逆地理编码MGeocoder.getAddress(lnglatXY);});//加点var marker = new AMap.Marker({map: mapObj,icon: new AMap.Icon({image: "/Public/images/js/mark.png",size: new AMap.Size(58, 30),imageOffset: new AMap.Pixel(-32, -0)}),position: lnglatXY,offset: new AMap.Pixel(-5, -30)});mapObj.setFitView();function onMouseOver(e) {var coor = e.split(',');var lnglat = new AMap.LngLat(coor[0], coor[1]);if (!geocoderMarker) {geocoderMarker = new AMap.Marker({map: mapObj,icon: "/images/0.png",position: lnglat,offset: new AMap.Pixel(-10, -34)});} else {geocoderMarker.setPosition(lnglat);}mapObj.setFitView();}//回调函数function geocoder_CallBack(data) {geocoderMarker = undefined;var resultStr = "";var roadinfo = "";var poiinfo = "";var address;//返回地址描述address = data.regeocode.formattedAddress;aimAddress = address;makeSure(); //把当前地址赋值给⽂本框//返回周边道路信息roadinfo += "<table style='width:600px'>";for (var i = 0; i < data.regeocode.roads.length; i++) {var color = (i % 2 === 0 ? '#fff' : '#eee');roadinfo += "<tr style='background-color:" + color + "; margin:0; padding:0;'><td>道路：" + data.regeocode.roads[i].name + "</td><td>⽅向：" + data.regeocode.roads[i].direction + "</td><td>距离：" + data.regeocode.roads[i].distance }roadinfo += "</table>";//返回周边兴趣点信息poiinfo += "<table style='width:600px;cursor:pointer;'>";for (var j = 0; j < data.regeocode.pois.length; j++) {var color = j % 2 === 0 ? '#fff' : '#eee';poiinfo += "<tr onmouseover='onMouseOver(\"" + data.regeocode.pois[j].location.toString() + "\")' style='background-color:" + color + "; margin:0; padding:0;'><td>兴趣点：" + data.regeocode.pois[j].name + "</td><td>类型：}poiinfo += "</table>";//返回结果拼接输出resultStr = "<div style=\"font-size: 12px;padding:0px 0 4px 2px; border-bottom:1px solid #C1FFC1;\">" + "<b>地址</b>：" + address + "<hr/><b>周边道路信息</b>：<br/>" + roadinfo + "<hr/><b>周边兴趣点信息</b>：<br/>"document.getElementById("result").innerHTML = resultStr;}//输⼊提⽰function autoSearch() {var keywords = document.getElementById("keyword").value;var auto;//加载输⼊提⽰插件mapObj.plugin(["AMap.Autocomplete"], function() {var autoOptions = {city: "" //城市，默认全国};auto = new AMap.Autocomplete(autoOptions);//查询成功时返回查询结果if ( keywords.length > 0) {AMap.event.addListener(auto,"complete",autocomplete_CallBack);auto.search(keywords);}else {document.getElementById("result1").style.display = "none";}});}//输出输⼊提⽰结果的回调函数function autocomplete_CallBack(data) {var resultStr = "";var tipArr = data.tips;if (tipArr&&tipArr.length>0) {for (var i = 0; i < tipArr.length; i++) {resultStr += "<div id='divid" + (i + 1) + "' onmouseover='openMarkerTipById(" + (i + 1)+ ",this)' onclick='selectResult(" + i + ")' onmouseout='onmouseout_MarkerStyle(" + (i + 1)+ ",this)' style=\"font-size: 13px;cursor:pointer;padding:5px 5px 5px 5px;\"" + "data=" + tipArr[i].adcode + ">" + tipArr[i].name + "<span style='color:#C1C1C1;'>"+ tipArr[i].district + "</span></div>";}}else {resultStr = " π__π亲,⼈家找不到结果!<br />要不试试：<br />1.请确保所有字词拼写正确<br />2.尝试不同的关键字<br />3.尝试更宽泛的关键字";}document.getElementById("result1").curSelect = -1;document.getElementById("result1").tipArr = tipArr;document.getElementById("result1").innerHTML = resultStr;document.getElementById("result1").style.display = "block";}//输⼊提⽰框⿏标滑过时的样式function openMarkerTipById(pointid, thiss) { //根据id打开搜索结果点tipthiss.style.background = '#CAE1FF';}//输⼊提⽰框⿏标移出时的样式function onmouseout_MarkerStyle(pointid, thiss) { //⿏标移开后点样式恢复thiss.style.background = "";}//从输⼊提⽰框中选择关键字并查询function selectResult(index) {if(index<0){return;}if (erAgent.indexOf("MSIE") > 0) {document.getElementById("keyword").onpropertychange = null;document.getElementById("keyword").onfocus = focus_callback;}//截取输⼊提⽰的关键字部分var text = document.getElementById("divid" + (index + 1)).innerHTML.replace(/<[^>].*?>.*<\/[^>].*?>/g,"");var cityCode = document.getElementById("divid" + (index + 1)).getAttribute('data');document.getElementById("keyword").value = text;document.getElementById("result1").style.display = "none";//根据选择的输⼊提⽰关键字查询mapObj.plugin(["AMap.PlaceSearch"], function() {var msearch = new AMap.PlaceSearch(); //构造地点查询类AMap.event.addListener(msearch, "complete", placeSearch_CallBack); //查询成功时的回调函数msearch.setCity(cityCode);msearch.search(text); //关键字查询查询});function focus_callback() {if (erAgent.indexOf("MSIE") > 0) {document.getElementById("keyword").onpropertychange = autoSearch;}}//输出关键字查询结果的回调函数function placeSearch_CallBack(data) {//清空地图上的InfoWindow和MarkerwindowsArr = [];searchMarker = [];addressArr = [];mapObj.clearMap();var resultStr1 = "";var poiArr = data.poiList.pois;var resultCount = poiArr.length;for (var i = 0; i < resultCount; i++) {addressArr[i] = poiArr[i].location;resultStr1 += "<div id='divid" + (i + 1) + "' onmouseover='openMarkerTipById1(" + i + ",this)' onclick='autoClickMap(" + i + ",this)' onmouseout='onmouseout_MarkerStyle(" + (i + 1) + ",this)' style=\"font-size: 12px;cursor:pointer;padding:0 resultStr1 += TipContents(poiArr[i].type, poiArr[i].address, poiArr[i].tel) + "</td></tr></table></div>";addmarker(i, poiArr[i]);}mapObj.setFitView();document.getElementById("result").innerHTML = resultStr1;document.getElementById("result").style.display = "block";}function autoClickMap(pointid, thiss){mapObj.clearMap();lnglatXY = addressArr[pointid];mapObj.setCenter(lnglatXY);geocoder();}//⿏标滑过查询结果改变背景样式，根据id打开信息窗体function openMarkerTipById1(pointid, thiss) {thiss.style.background = '#CAE1FF';windowsArr[pointid].open(mapObj, searchMarker[pointid]);}//添加查询结果的marker&infowindowfunction addmarker(i, d) {var lngX = d.location.getLng();var latY = d.location.getLat();var markerOption = {map:mapObj,icon:"/images/" + (i + 1) + ".png",position:new AMap.LngLat(lngX, latY)};var mar = new AMap.Marker(markerOption);searchMarker.push(new AMap.LngLat(lngX, latY));var infoWindow = new Window({content:"<h3><font color=\"#00a6ac\"> " + (i + 1) + ". " + + "</font></h3>" + TipContents(d.type, d.address, d.tel),size:new AMap.Size(300, 0),autoMove:true,offset:new AMap.Pixel(0,-30)});windowsArr.push(infoWindow);var aa = function (e) {infoWindow.open(mapObj, mar.getPosition());};AMap.event.addListener(mar, "click", aa);}//infowindow显⽰内容function TipContents(type, address, tel) { //窗体内容if (type == "" || type == "undefined" || type == null || type == " undefined" || typeof type == "undefined") {type = "暂⽆";}if (address == "" || address == "undefined" || address == null || address == " undefined" || typeof address == "undefined") {address = "暂⽆";}if (tel == "" || tel == "undefined" || tel == null || tel == " undefined" || typeof address == "tel") {tel = "暂⽆";}var str = " 地址：" + address + "<br /> 电话：" + tel + " <br /> 类型：" + type;return str;}function keydown(event){var key = (event||window.event).keyCode;var result = document.getElementById("result1")var cur = result.curSelect;if(key===40){//downif(cur + 1 < result.childNodes.length){if(result.childNodes[cur]){result.childNodes[cur].style.background='';}result.curSelect=cur+1;result.childNodes[cur+1].style.background='#CAE1FF';document.getElementById("keyword").value = result.tipArr[cur+1].name;}}else if(key===38){//upif(cur-1>=0){if(result.childNodes[cur]){result.childNodes[cur].style.background='';}result.curSelect=cur-1;result.childNodes[cur-1].style.background='#CAE1FF';document.getElementById("keyword").value = result.tipArr[cur-1].name;}}else if(key === 13){var res = document.getElementById("result1");if(res && res['curSelect'] !== -1){selectResult(document.getElementById("result1").curSelect);}}else{autoSearch();}}</script></body></html>。

高德地图经纬度查询定位怎么查

高德地图经纬度查询定位怎么查高德地图是一款广受欢迎的地图应用程序，提供了丰富的地图信息和定位服务。

如果您想查询特定位置的经纬度信息或查找一组经纬度对应的位置，高德地图提供了简便的方法来实现这些功能。

以下是使用高德地图进行经纬度查询和定位的步骤：1. 访问高德地图官方网站首先，在您的浏览器中打开高德地图官方网站。

您可以通过输入“高德地图官方网站”进行搜索，然后选择官方网站链接进行访问。

2. 进入地图界面一旦您进入高德地图官方网站，您将看到一个大的地图界面。

这是您开始进行经纬度查询和定位的起点。

3. 输入经纬度查询在地图界面的顶部工具栏上，您会看到一个搜索框。

在搜索框中，您可以输入经纬度信息来查询对应的位置。

输入的格式通常是“纬度, 经度”或“经度, 纬度”。

输入完毕后，按下“Enter”键或点击搜索按钮执行查询。

4. 查看查询结果高德地图将根据您的输入显示查询结果。

查询结果通常会在地图上以一个图标或标记的形式显示，并附带一些相关信息。

您可以点击标记或查看信息窗口来获取详细的位置信息。

5. 使用经纬度进行定位如果您已经拥有一组经纬度，您也可以使用它们在高德地图中进行定位。

只需将经纬度输入到搜索框中，并按下“Enter”键或点击搜索按钮，高德地图将定位到相应的位置。

6. 切换地图视图高德地图提供了多种地图视图，包括街道地图、卫星地图和混合地图。

您可以在地图界面的右上角找到一个按钮，用于切换地图视图。

点击该按钮，选择您想要查看的地图视图。

7. 获取更多位置信息除了经纬度之外，高德地图还提供了其他有用的位置信息。

您可以在查询结果或标记的信息窗口中找到这些信息。

它们可能包括地址、周边兴趣点、交通状况等。

通过查看这些信息，您可以更加全面地了解您所查询的位置。

8. 导航与路线规划如果您计划从当前位置到查询结果的位置，高德地图还提供导航和路线规划功能。

在信息窗口或查询结果的下方，您可能会看到一个导航或路线规划的按钮。

【高德地图API】从零开始学高德JSAPI（四）搜索服务——POI搜索自动完成输入提示行政。。。

【⾼德地图API】从零开始学⾼德JSAPI（四）搜索服务——POI搜索⾃动完成输⼊提⽰⾏政。

摘要：地图服务，⼤家能想到哪些？POI搜素，输⼊提⽰，地址解析，公交导航，驾车导航，步⾏导航，道路查询（交叉⼝），⾏政区划等等。

如果说覆盖物Marker是地图的⾻骼，那么服务，就是地图的⽓⾎。

有个各种各样的地图服务，我们的地图应⽤才能变得有⾎有⾁，活灵活现。

第四篇拆成了⼏个要点，本篇主要讲搜索服务。

包括周边搜索，关键词搜索，范围搜索，搜索提⽰（⾃动完成，输⼊提⽰），⾏政区域，交叉路⼝，检索⾃有数据（云图）。

⽰意图1：⾃动完成，输⼊提⽰⽰意图2：云图，⾃有数据检索，A-H图标显⽰，⿇点图---------------------------------------------------------------------------------------⼀、POI搜索1、关键字查询使⽤search⽅法，传⼀个关键词参数即可。

MSearch.search('东⽅明珠'); //关键字查询完整代码：//关键词查询function placeSearch1() {var MSearch;mapObj.plugin(["AMap.PlaceSearch"], function() {MSearch = new AMap.PlaceSearch({ //构造地点查询类pageSize:10,pageIndex:1,city:"021" //城市});AMap.event.addListener(MSearch, "complete", keywordSearch_CallBack);//返回地点查询结果MSearch.search('东⽅明珠'); //关键字查询});}⽰意图：2、输⼊提⽰html部分：<div class="autoclass"><input type="text" id="keyword" name="keyword" value="" style="width: 95%;"/><div id="result1" class="autobox" name="result1"></div></div>JS部分：在地图初始化时，添加【⾃动完成/输⼊提⽰】插件。

js获取位置坐标的方法

js获取位置坐标的方法一、概述JavaScript是一种广泛使用的编程语言，它允许开发人员创建动态、交互式的网页和应用程序。

在JavaScript中，获取位置坐标的方法可以帮助我们获取用户当前的位置信息。

本篇文章将介绍如何使用JavaScript获取位置坐标的方法。

二、方法介绍1. 使用`navigator.geolocation` API`navigator.geolocation` API是获取位置坐标的常用方法之一。

它允许浏览器获取用户的地理位置信息，包括经度、纬度等。

下面是一个使用`navigator.geolocation` API获取位置坐标的简单示例：```javascriptif (navigator.geolocation) {navigator.geolocation.getCurrentPosition(function(position) {// 获取位置坐标var lat = titude;var lon = position.coords.longitude;console.log("当前位置坐标：纬度：" + lat + ", 经度：" + lon);}, function(error) {console.log("获取位置信息失败：" + error.message);});} else {console.log("浏览器不支持获取位置信息");}```2. 使用第三方库除了使用浏览器的原生API外，还可以使用第三方库来获取位置坐标。

一些常用的JavaScript库包括`geo-location-js`和`simple-geolocation`等。

这些库提供了更简单、更方便的方法来获取位置坐标，通常还支持自动检测和切换不同的定位服务。

三、使用示例以下是一个使用第三方库`simple-geolocation`获取位置坐标的示例：首先，需要将库文件引入到HTML文件中：```html<script src="path/to/simple-geolocation.js"></script>```然后，在JavaScript代码中使用该库：```javascriptsimpleGeoLocation.getLocation(function(position) {// 获取位置坐标var lat = titude;var lon = position.coords.longitude;console.log("当前位置坐标：纬度：" + lat + ", 经度：" + lon);}, function(error) {console.log("获取位置信息失败：" + error);});```四、总结在本篇文章中，我们介绍了两种在JavaScript中获取位置坐标的方法：使用`navigator.geolocation` API和第三方库。

使用javaScript从高德地图获取数据

使用javaScript从高德地图获取数据12308047 姚逸璠A、工具：Visual Studio 2010B、语言：HTML、javaScriptC、实现流程：1、在visual studio中，点击文件->新建->网站,得到下图：选择：空网站。

2、在“设计”视图下，使用工具箱分别添加一个“div容器”，与一个“Button”，如下：3、转到“源”视图，为Button添加监听器onclick,并附上javascript代码，代码如下所示（注意需要填入申请的高德map 的key，以及构造map时使用我们刚刚添加的容器）<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/><title>关键字查询</title><style type="text/css">body{margin:0;height:100%;width:100%;position:absolute;font-size:12px;}#mapContainer{position: absolute;top:0;left: 0;right:0;bottom:0;}#mapSearch1{position: absolute;top:0;left: 100;pageIndex:1;}</style></head><body><div id="mapContainer"></div><button id="mapSearch1" onclick="javascript:placeSearch();">关键词搜索</button> <script type="text/javascript"src="/maps?v=1.3&key=be64fe8a1752d3437dbbb715f3 59a141"></script><script type="text/javascript">var map = new AMap.Map("mapContainer", {resizeEnable: true});var marker = new Array();var windowsArr = new Array();//基本地图加载function placeSearch(){var MSearch;AMap.service(["AMap.PlaceSearch"], function() {MSearch = new AMap.PlaceSearch({ //构造地点查询类pageSize:10,pageIndex:1,city:"020" //城市});//关键字查询MSearch.search('白云宾馆', function(status, result){if(status === 'complete' && === 'OK'){keywordSearch_CallBack(result);}else{ alert("Failed");}});});}// placeSearch();//添加marker&infowindowfunction addmarker(i, d) {var lngX = d.location.getLng();var latY = d.location.getLat();var markerOption = {map:map,icon:"/images/" + (i + 1) + ".png",position:new AMap.LngLat(lngX, latY),topWhenMouseOver:true};var mar = new AMap.Marker(markerOption);marker.push(new AMap.LngLat(lngX, latY));var infoWindow = new Window({content:"<h3><font color=\"#00a6ac\"> " + (i + 1) + ". " + + "</font></h3>" + TipContents(d.type, d.address, d.tel),size:new AMap.Size(300, 0),autoMove:true,offset:new AMap.Pixel(0,-20)});windowsArr.push(infoWindow);var aa = function (e) {infoWindow.open(map, mar.getPosition());};AMap.event.addListener(mar, "mouseover", aa);}//回调函数function keywordSearch_CallBack(data) {var resultStr = "";var poiArr = data.poiList.pois;var resultCount = poiArr.length;for (var i = 0; i < resultCount; i++) {resultStr += "<div id='divid" + (i + 1) + "'onmouseover='openMarkerTipById1(" + i + ",this)'onmouseout='onmouseout_MarkerStyle(" + (i + 1) + ",this)' style=\"font-size:12px;cursor:pointer;padding:0px 0 4px 2px; border-bottom:1px solid#C1FFC1;\"><table><tr><td><img src=\"/images/" + (i + 1) + ".png\"></td>" + "<td><h3><font color=\"#00a6ac\">名称: " + poiArr[i].name +"</font></h3>";resultStr += TipContents(poiArr[i].type, poiArr[i].address,poiArr[i].tel) + "</td></tr></table></div>";addmarker(i, poiArr[i]);}map.setFitView();}function TipContents(type, address, tel) { //窗体内容if (type == "" || type == "undefined" || type == null || type == " undefined" || typeof type == "undefined") {type = "暂无";}if (address == "" || address == "undefined" || address == null || address == " undefined" || typeof address == "undefined") {address = "暂无";}if (tel == "" || tel == "undefined" || tel == null || tel == " undefined" || typeof address == "tel") {tel = "暂无";}var str = " 地址：" + address + "<br /> 电话：" + tel + " <br /> 类型："+ type;return str;}function openMarkerTipById1(pointid, thiss) { //根据id 打开搜索结果点tip thiss.style.background = '#CAE1FF';windowsArr[pointid].open(map, marker[pointid]);}function onmouseout_MarkerStyle(pointid, thiss) { //鼠标移开后点样式恢复thiss.style.background = "";}</script></body></html>4、添加连接数据库以及存放数据的函数，为了方便起见，我们将其放于javascript代码的最后：function addStation(Name, Longitude, Latitude) {var conn = new ActiveXObject("ADODB.Connection");conn.Open(" Provider=microsoft.jet.oledb.4.0;data source=E:\\12交通班大三下\\gis\\高德map获取数据.mdb;"); //E:\12交通班大三下\gisvar sql = "insert into gaode(PosName,Lng,Lat) values('" +Name+ "','"+Longitude+ "','" +Latitude+ "')";try {conn.execute(sql);}catch (e) {document.write(e.description);alert("Fail~~~");}}5、在合适位置调用addStation(Name, Longitude, Latitude) 这个函数，由于我们需要获得数据，应当于高德地图调用数据的部分调用这个函数，选择在回调函数：function keywordSearch_CallBack(data) {var resultStr = "";var poiArr = data.poiList.pois;var resultCount = poiArr.length;for (var i = 0; i < resultCount; i++) {resultStr += "<div id='divid" + (i + 1) + "'onmouseover='openMarkerTipById1(" + i + ",this)'onmouseout='onmouseout_MarkerStyle(" + (i + 1) + ",this)' style=\"font-size:12px;cursor:pointer;padding:0px 0 4px 2px; border-bottom:1px solid#C1FFC1;\"><table><tr><td><img src=\"/images/" + (i + 1) + ".png\"></td>" + "<td><h3><font color=\"#00a6ac\">名称: " + poiArr[i].name +"</font></h3>";resultStr += TipContents(poiArr[i].type, poiArr[i].address, poiArr[i].tel) + "</td></tr></table></div>";addmarker(i, poiArr[i]);addStation(poiArr[i].name, poiArr[i].location.getLng(),poiArr[i].location.getLat());}map.setFitView();}中的循环调用数据中添加addStation函数，如上所示。

高德地图JSAPI获取经纬度，根据经纬度获取城市

⾼德地图JSAPI获取经纬度，根据经纬度获取城市<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>输⼊提⽰后查询，点击获取坐标</title><style type="text/css">#mapContainer{position: absolute;top:0;left: 0;right:0;bottom:0;}#tip{background-color:#fff;border:1px solid #ccc;padding-left:10px;padding-right:2px;position:absolute;min-height:65px;top:10px;font-size:12px;right:10px;border-radius:3px;overflow:hidden;line-height:20px;min-width:30%;}#tip input[type="button"]{background-color: #0D9BF2;height:25px;text-align:center;line-height:25px;color:#fff;font-size:12px;border-radius:3px;outline: none;border:0;cursor:pointer;}#tip input[type="text"]{height:25px;border:1px solid #ccc;padding-left:5px;border-radius:3px;outline:none;}#pos{height: 110px;background-color: #fff;padding-left: 10px;padding-right: 10px;position:absolute;font-size: 12px;right: 10px;bottom: 30px;border-radius: 3px;line-height: 30px;border:1px solid #ccc;}#pos input{border:1px solid #ddd;height:23px;border-radius:3px;outline:none;width: 100px;}#result1{max-height:300px;}b{display: block;margin: 5px 0;}</style></head><body><div style="width: 500px;height: 500px;position: relative;"><div id="mapContainer"></div><div id="tip"><b>请输⼊关键字：</b><input type="text" id="keyword" name="keyword" value="" onkeydown='keydown(event)' style="width: 95%;"/><div id="result1" name="result1"></div></div><div id="pos"><b>⿏标左键在地图上单击获取坐标</b><div>X：<input type="text" id="lngX" name="lngX" value=""/> Y：<input type="text" id="latY" name="latY" value=""/></div><div>城市：<input type="text" id="city" name="city" value=""/></div></div></div><script type="text/javascript" src="/maps?v=1.3&key=84a1f826e2e135184370cddc9e7848acluo"></script><script type="text/javascript">var windowsArr = [];var marker = [];var mapObj = new AMap.Map("mapContainer", {resizeEnable: true,view: new AMap.View2D({resizeEnable: true,zoom:13//地图显⽰的缩放级别}),keyboardEnable:false});var clickEventListener=AMap.event.addListener(mapObj,'click',function(e){console.log(e);document.getElementById("lngX").value=e.lnglat.getLng();document.getElementById("latY").value=e.lnglat.getLat();AMap.service('AMap.Geocoder',function(){//回调函数//实例化Geocodergeocoder = new AMap.Geocoder({city: ""//城市，默认：“全国”});var lnglatXY=[e.lnglat.getLng(), e.lnglat.getLat()];//地图上所标点的坐标geocoder.getAddress(lnglatXY, function(status, result) {if (status === 'complete' && === 'OK') {//获得了有效的地址信息://即，result.regeocode.formattedAddress//console.log(result);var city = result.regeocode.addressComponent.city;}else{var city = '获取失败';//获取地址失败}document.getElementById("city").value=city;console.log(city);});})});document.getElementById("keyword").onkeyup = keydown;//输⼊提⽰function autoSearch() {var keywords = document.getElementById("keyword").value;var auto;//加载输⼊提⽰插件AMap.service(["AMap.Autocomplete"], function() {var autoOptions = {city: "" //城市，默认全国};auto = new AMap.Autocomplete(autoOptions);//查询成功时返回查询结果if ( keywords.length > 0) {auto.search(keywords, function(status, result){autocomplete_CallBack(result);});}else {document.getElementById("result1").style.display = "none";}});}//输出输⼊提⽰结果的回调函数function autocomplete_CallBack(data) {var resultStr = "";var tipArr = data.tips;if (tipArr&&tipArr.length>0) {for (var i = 0; i < tipArr.length; i++) {resultStr += "<div id='divid" + (i + 1) + "' onmouseover='openMarkerTipById(" + (i + 1)+ ",this)' onclick='selectResult(" + i + ")' onmouseout='onmouseout_MarkerStyle(" + (i + 1)+ ",this)' style=\"font-size: 13px;cursor:pointer;padding:5px 5px 5px 5px;\"" + "data=" + tipArr[i].adcode + ">" + tipArr[i].name + "<span style='color:#C1C1C1;'>"+ tipArr[i].district + "</span></div>";}}else {resultStr = " π__π亲,⼈家找不到结果!<br />要不试试：<br />1.请确保所有字词拼写正确<br />2.尝试不同的关键字<br />3.尝试更宽泛的关键字";}document.getElementById("result1").curSelect = -1;document.getElementById("result1").tipArr = tipArr;document.getElementById("result1").innerHTML = resultStr;document.getElementById("result1").style.display = "block";}//输⼊提⽰框⿏标滑过时的样式function openMarkerTipById(pointid, thiss) { //根据id打开搜索结果点tipthiss.style.background = '#CAE1FF';}//输⼊提⽰框⿏标移出时的样式function onmouseout_MarkerStyle(pointid, thiss) { //⿏标移开后点样式恢复thiss.style.background = "";}//从输⼊提⽰框中选择关键字并查询function selectResult(index) {if(index<0){return;}if (erAgent.indexOf("MSIE") > 0) {document.getElementById("keyword").onpropertychange = null;document.getElementById("keyword").onfocus = focus_callback;}//截取输⼊提⽰的关键字部分var text = document.getElementById("divid" + (index + 1)).innerHTML.replace(/<[^>].*?>.*<\/[^>].*?>/g,"");var cityCode = document.getElementById("divid" + (index + 1)).getAttribute('data');document.getElementById("keyword").value = text;document.getElementById("result1").style.display = "none";//根据选择的输⼊提⽰关键字查询mapObj.plugin(["AMap.PlaceSearch"], function() {var msearch = new AMap.PlaceSearch(); //构造地点查询类AMap.event.addListener(msearch, "complete", placeSearch_CallBack); //查询成功时的回调函数msearch.setCity(cityCode);//console.log(cityCode);msearch.search(text); //关键字查询查询});}//定位选择输⼊提⽰关键字function focus_callback() {if (erAgent.indexOf("MSIE") > 0) {document.getElementById("keyword").onpropertychange = autoSearch;}}//输出关键字查询结果的回调函数function placeSearch_CallBack(data) {//清空地图上的InfoWindow和MarkerwindowsArr = [];marker = [];mapObj.clearMap();var resultStr1 = "";var poiArr = data.poiList.pois;var resultCount = poiArr.length;for (var i = 0; i < resultCount; i++) {resultStr1 += "<div id='divid" + (i + 1) + "' onmouseover='openMarkerTipById1(" + i + ",this)' onmouseout='onmouseout_MarkerStyle(" + (i + 1) + ",this)' style=\"font-size: 12px;cursor:pointer;padding:0px 0 4px 2px; border-bottom:1px solid resultStr1 += TipContents(poiArr[i].type, poiArr[i].address, poiArr[i].tel) + "</td></tr></table></div>";addmarker(i, poiArr[i]);}mapObj.setFitView();}//⿏标滑过查询结果改变背景样式，根据id打开信息窗体function openMarkerTipById1(pointid, thiss) {thiss.style.background = '#CAE1FF';windowsArr[pointid].open(mapObj, marker[pointid]);}//添加查询结果的marker&infowindowfunction addmarker(i, d) {var lngX = d.location.getLng();var latY = d.location.getLat();var markerOption = {map:mapObj,icon:"/images/" + (i + 1) + ".png",position:new AMap.LngLat(lngX, latY)};var mar = new AMap.Marker(markerOption);marker.push(new AMap.LngLat(lngX, latY));var infoWindow = new Window({content:"<h3><font color=\"#00a6ac\"> " + (i + 1) + ". " + + "</font></h3>" + TipContents(d.type, d.address, d.tel), size:new AMap.Size(300, 0),autoMove:true,offset:new AMap.Pixel(0,-30)});windowsArr.push(infoWindow);var autoData = function (e) {var nowPosition = mar.getPosition(),lng_str = nowPosition.lng,lat_str = t;infoWindow.open(mapObj, nowPosition);document.getElementById("lngX").value = lng_str;document.getElementById("latY").value = lat_str;AMap.service('AMap.Geocoder',function(){//回调函数//实例化Geocodergeocoder = new AMap.Geocoder({city: ""//城市，默认：“全国”});var lnglatXY=[lng_str, lat_str];//地图上所标点的坐标geocoder.getAddress(lnglatXY, function(status, result) {if (status === 'complete' && === 'OK') {//获得了有效的地址信息://即，result.regeocode.formattedAddress//console.log(result);var city = result.regeocode.addressComponent.city;}else{var city = '获取失败';//获取地址失败}document.getElementById("city").value=city;console.log(city);});})};AMap.event.addListener(mar, "mouseover", autoData);}//infowindow显⽰内容function TipContents(type, address, tel) { //窗体内容if (type == "" || type == "undefined" || type == null || type == " undefined" || typeof type == "undefined") {type = "暂⽆";}if (address == "" || address == "undefined" || address == null || address == " undefined" || typeof address == "undefined") {address = "暂⽆";}if (tel == "" || tel == "undefined" || tel == null || tel == " undefined" || typeof address == "tel") {tel = "暂⽆";}var str = " 地址：" + address + "<br /> 电话：" + tel + " <br /> 类型：" + type;return str;}function keydown(event){var key = (event||window.event).keyCode;var result = document.getElementById("result1")var cur = result.curSelect;if(key===40){//downif(cur + 1 < result.childNodes.length){if(result.childNodes[cur]){result.childNodes[cur].style.background='';}result.curSelect=cur+1;result.childNodes[cur+1].style.background='#CAE1FF';document.getElementById("keyword").value = result.tipArr[cur+1].name;}}else if(key===38){//upif(cur-1>=0){if(result.childNodes[cur]){result.childNodes[cur].style.background='';}result.curSelect=cur-1;result.childNodes[cur-1].style.background='#CAE1FF';document.getElementById("keyword").value = result.tipArr[cur-1].name;}}else if(key === 13){var res = document.getElementById("result1");if(res && res['curSelect'] !== -1){selectResult(document.getElementById("result1").curSelect);}}else{autoSearch();}}</script></body></html>。

JavaScript中代码错误排查与修复技巧

JavaScript中代码错误排查与修复技巧JavaScript是一种广泛使用的脚本语言，但由于其动态性和弱类型特性，常常容易出现错误。

为了排查和修复这些错误，开发人员需要掌握一些技巧和方法。

以下是一些常见的JavaScript代码错误排查与修复技巧。

1.使用开发者工具浏览器提供了强大的开发者工具，可以帮助我们调试JavaScript代码。

其中包括控制台(console)、断点调试(debugger)、性能分析器(profiler)等工具。

通过使用这些工具，我们可以查看变量值、调用堆栈、错误消息等信息，从而更好地理解和排查错误。

2.仔细阅读错误消息当JavaScript代码出现错误时，浏览器会显示错误消息。

仔细阅读错误消息，可以帮助我们确定错误的类型和位置。

错误消息通常包含错误类型、文件名、行数等信息，这些信息对于定位错误非常重要。

3.缩小错误范围当出现错误时，我们可以通过逐步缩小错误范围来定位问题所在。

可以通过注释代码的方式或者分步执行代码的方式，逐步排除可能出错的部分。

当确定问题所在后，就可以针对性地进行修复。

4.使用断言和异常处理断言(assertion)和异常处理(exception handling)是JavaScript 代码中常用的技术。

断言可以帮助我们在代码中设置预期条件，以便在运行时验证这些条件是否成立。

异常处理则用于捕获和处理代码运行时发生的异常。

通过使用这些技术，我们可以更早地发现和处理错误。

5.编写单元测试单元测试可以帮助我们验证代码的正确性，并在代码发生变动后发现潜在的错误。

使用测试框架，编写各种场景的测试用例，以覆盖代码的不同执行路径和边界条件。

通过运行这些单元测试，我们可以更好地捕捉和修复潜在的错误。

6.代码审查和团队合作在项目开发过程中，通过代码审查和团队合作也可以发现和修复错误。

代码审查可以帮助我们发现潜在的问题，并提供改进的建议。

团队合作可以让我们共同面对问题，并集思广益，找到最佳的解决方案。

JavaScript代码调试与错误排查的方法与工具

JavaScript代码调试与错误排查的方法与工具JavaScript作为一种广泛应用于网页开发和前端技术的编程语言，调试和错误排查是开发过程中不可或缺的一部分。

本文将介绍一些常用的方法和工具，以帮助开发人员更高效地进行JavaScript代码调试与错误排查。

一、使用浏览器内置的开发者工具进行调试现代浏览器都内置了强大的开发者工具，提供了一系列调试功能。

其中，常用的调试功能包括：1. 控制台(Console)：开启浏览器的开发者工具，切换到控制台选项卡，可以查看和调试JavaScript代码。

在控制台中，可以输出日志、检查变量的值、执行代码片段等。

2. 断点调试(Breakpoints)：在代码中设置断点，可以暂停代码的执行，以便逐行查看和分析代码执行过程。

开发者可以在断点暂停时检查变量的值、观察代码执行流程等。

3. 监视器(Watch)：使用监视器功能，可以跟踪和观察指定变量的值的变化，帮助开发者更好地理解代码的执行情况。

4. 堆栈追踪(Stack Trace)：在调试过程中，浏览器会记录代码的调用栈，即从主函数开始到当前执行位置的函数调用序列。

通过堆栈追踪，可以溯源到错误发生的代码位置，便于快速定位问题。

二、使用eslint等静态代码检查工具静态代码检查工具可以帮助开发人员在编码阶段发现潜在的问题和错误，并提供相应的修复建议。

其中，eslint是一款广泛使用的JavaScript静态代码检查工具。

通过在代码中添加eslint规则，可以在代码编写过程中实时检查错误和潜在问题，提高代码质量。

eslint支持自定义规则，并提供了一系列预设规则，涵盖了JavaScript编码中的各个方面。

开发人员可以根据自己的项目需求和编码规范进行配置。

三、使用Chrome DevTools的追踪和性能分析功能除了常规的调试功能，Chrome DevTools还提供了一些高级的追踪和性能分析工具，帮助开发人员更深入地理解和优化JavaScript代码。

js调用高德地图API获取地理信息进行定位

js调⽤⾼德地图API获取地理信息进⾏定位<script type="text/javascript" src="/maps?v=1.3&key=(需要⾃⼰去⾼德官⽹获取)"></script><script type="text/javascript">var map = new AMap.Map('mapContainer', {resizeEnable: true})map.plugin('AMap.Geolocation', function() {var geolocation = new AMap.Geolocation({// 是否使⽤⾼精度定位，默认：trueenableHighAccuracy: true,// 设置定位超时时间，默认：⽆穷⼤timeout: 10000,// 定位按钮的停靠位置的偏移量，默认：Pixel(10, 20)buttonOffset: new AMap.Pixel(10, 20),// 定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：falsezoomToAccuracy: true,// 定位按钮的排放位置, RB表⽰右下buttonPosition: 'RB'})// 获取当前位置信息geolocation.getCurrentPosition();// 监听获取位置信息成功的回调函数AMap.event.addListener(geolocation, 'complete', onComplete);// 监听获取位置信息错误的回调函数AMap.event.addListener(geolocation, 'error', onError);function onComplete (data) {// data是具体的定位信息addComp = data.addressComponent;// 获取信息中的省市区并放⼊到输⼊框中$("#fsenderAddress").val(addComp.province+"-"+addComp.city+"-"+addComp.district).trigger("change");$("#fsenderCountyCode").val(addComp.adcode);let fsenderMsg = {'fsenderAddress':$("#fsenderAddress").val(),'fsenderCountyCode':$("#fsenderCountyCode").val()}window.sessionStorage.setItem('fsendMsg', JSON.stringify(fsenderMsg));}function onError (error) {// 定位出错console.log(error)}})</script>。

Android高德地图之poi搜索功能的实现代码

Android⾼德地图之poi搜索功能的实现代码废话不多说,先看效果，如果⼤家感觉不错，请参考实现代码这个功能我是⽤Fragmentdialog⾥⾯做的,也遇到不少坑第⼀,就是设置背景的drawable为纯⽩⾊导致键盘弹出的时候,recyclerview的布局被顶上去导致出现⽩⾊布局,有点扎眼;最后改成了设置为和背景⾊⼀个颜⾊就和好了Window window = getDialog().getWindow();youtParams lp = window.getAttributes();lp.gravity = Gravity.CENTER;window.setBackgroundDrawable(new ColorDrawable(ContextCompat.getColor(getActivity(), R.color.color_gray_f2)));window.setAttributes(lp);布局<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"xmlns:tools="/tools"android:background="@color/color_gray_f2"android:orientation="vertical"><RelativeLayoutandroid:id="@+id/search_maps_bar"android:layout_width="match_parent"android:layout_height="50dp"android:layout_centerHorizontal="true"android:layout_marginLeft="15dp"android:layout_marginRight="15dp"android:layout_marginTop="10dp"android:background="@drawable/new_card"><ImageButtonandroid:id="@+id/dialog_search_back"android:layout_width="50dp"android:layout_height="match_parent"android:layout_centerVertical="true"android:layout_margin="2dp"android:background="@drawable/button_background_selector"android:src="@drawable/ic_qu_appbar_back"/>android:id="@+id/dialog_serach_btn_search"android:layout_width="50dp"android:layout_height="match_parent"android:layout_alignParentRight="true"android:layout_centerVertical="true"android:layout_margin="2dp"android:background="@drawable/button_background_selector"android:src="@drawable/ic_qu_search"tools:ignore="ContentDescription,RtlHardcoded"/><EditTextandroid:id="@+id/dialog_search_et"android:layout_width="wrap_content"android:layout_height="match_parent"android:layout_centerInParent="true"android:layout_marginLeft="5.0dip"android:layout_marginRight="5.0dip"android:layout_toLeftOf="@+id/dialog_serach_btn_search"android:layout_toRightOf="@+id/dialog_search_back"android:background="@android:color/transparent"android:completionThreshold="1"android:dropDownVerticalOffset="1.0dip"android:hint="请输⼊关键字"android:imeOptions="actionSearch|flagNoExtractUi"android:inputType="text|textAutoComplete"android:maxHeight="50dp"android:maxLength="20"android:minHeight="50dp"android:singleLine="true"android:textColor="#000000"android:textSize="16.0sp"/></RelativeLayout><android.support.v7.widget.RecyclerViewandroid:id="@+id/dialog_search_recyclerview"android:layout_width="match_parent"android:layout_height="match_parent"android:layout_marginLeft="15dp"android:layout_marginRight="15dp"android:layout_marginTop="@dimen/dp_10" /></LinearLayout>第⼆个问题是键盘弹出的时候,会出现dialog布局整体被顶上去最后通过设置 style来解决@Overridepublic void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);//解决dialogfragment布局不被顶上去的⽅法setStyle(DialogFragment.STYLE_NORMAL, android.R.style.Theme_Black_NoTitleBar);}最后就是实现搜索功能了第⼀个点击搜索时,键盘和搜索按钮两个都是同样的效果/*** 搜索功能*/private void searchLocationPoi() {//关闭键盘KeyBoardUtils.closeKeybord(poiSearchInMaps, BaseApplication.mContext);if (TextUtils.isEmpty(poiSearchInMaps.getText().toString().trim())) {ToastUtils.showToastCenter("内容为空!");} else {query = new PoiSearch.Query(poiSearchInMaps.getText().toString().trim(), "", "");// 第⼀个参数表⽰搜索字符串，第⼆个参数表⽰poi搜索类型，第三个参数表⽰poi搜索区域（空字符串代表全国） query.setPageSize(20);// 设置每页最多返回多少条poiitemquery.setPageNum(0);// 设置查第⼀页poiSearch = new PoiSearch(getActivity(), query);poiSearch.setOnPoiSearchListener(this);poiSearch.searchPOIAsyn();}}然后回调中进⾏处理@Overridepublic void onPoiSearched(PoiResult poiResult, int errcode) {Logger.e(poiResult.getPois().toString() + "" + errcode);if (errcode == 1000) {datas = new ArrayList<>();ArrayList<PoiItem> pois = poiResult.getPois();for (int i = 0; i < pois.size(); i++) {LocationBean locationBean = new LocationBean();locationBean.title = pois.get(i).getTitle();locationBean.snippet = pois.get(i).getSnippet();datas.add(locationBean);}searchCarAdapter.setNewData(datas);}}还有就是监听EditText⾥⾯内容的变化来搜索,其实也很简单poiSearchInMaps.addTextChangedListener(new TextWatcher() {public void beforeTextChanged(CharSequence charSequence, int i, int i1, int i2) {}@Overridepublic void onTextChanged(CharSequence charSequence, int i, int i1, int i2) {textChangeSearch(charSequence);}@Overridepublic void afterTextChanged(Editable editable) {}});/*** 监听edittext内容的变化,去搜索*/private void textChangeSearch(CharSequence charSequence) {String content = charSequence.toString().trim();//获取⾃动提⽰输⼊框的内容Logger.e(content);InputtipsQuery inputtipsQuery = new InputtipsQuery(content, "");//初始化⼀个输⼊提⽰搜索对象，并传⼊参数Inputtips inputtips = new Inputtips(getActivity(), inputtipsQuery);//定义⼀个输⼊提⽰对象，传⼊当前上下⽂和搜索对象inputtips.setInputtipsListener(new Inputtips.InputtipsListener() {@Overridepublic void onGetInputtips(List<Tip> list, int errcode) {Logger.e(list.toString() + errcode);if (errcode == 1000 && list != null) {datas = new ArrayList<>();for (int i = 0; i < list.size(); i++) {LocationBean locationBean = new LocationBean();Tip tip = list.get(i);titude = tip.getPoint().getLatitude();locationBean.longitude = tip.getPoint().getLongitude();locationBean.snippet = tip.getName();locationBean.title = tip.getDistrict();datas.add(locationBean);}searchCarAdapter.setNewData(datas);}}});//设置输⼊提⽰查询的监听，实现输⼊提⽰的监听⽅法onGetInputtips()inputtips.requestInputtipsAsyn();//输⼊查询提⽰的异步接⼝实现}ok,搞定,最后只需要搞个回调,把Search后点击的item传回去就好了.希望对⼤家有所帮助，如果⼤家有任何疑问请给我留⾔，⼩编会及时回复⼤家的。

vue+高德地图实现地图搜索及点击定位操作

vue+⾼德地图实现地图搜索及点击定位操作⾸先需要在index.html中引⼊⾼德地图的js链接，key需要换成你⾃⼰的key最近有个需求是实现⼀个使⽤地图搜索定位的功能，在⽹上参考了下其他的⽂章，感觉不是很完善，⾃⼰整理了⼀下，可以实现点击定位，搜索列表定位等功能，可能有些地⽅是多余的，需要的⾃⼰看着改下<script type="text/javascript" src="https:///maps?v=1.4.14&key=你的key"></script>效果图如下下边就是实现过程html部分<template><div id="wrap"><div id="searchWrap"><div class="searchWrap"><input type="text" v-model="address" @input="search"><button @click="search">搜索</button></div><div id="result" class="amap_lib_placeSearch" v-show="hide"><div class="amap_lib_placeSearch_list amap-pl-pc" v-for="(item,index) in poiArr"@click="openMarkerTipById(index,$event)"@mouseout="onmouseout_MarkerStyle(index+1,$event)":key="index"><div class="poibox" style="border-bottom: 1px solid #eaeaea"><div class="amap_lib_placeSearch_poi poibox-icon" :class="index==selectedIndex?'selected':''">{{index+1}}</div><div class="poi-img" v-if="item.url" :style="'background-image:url('+item.url+'?operate=merge&w=90&h=56&position=5)'"></div><h3 class="poi-title" ><span class="poi-name">{{}}</span></h3><div class="poi-info"><p class="poi-addr">地址：{{item.address}}</p><p class="poi-tel">电话：{{item.tel}}</p></div><div class="clear"></div></div></div></div></div><div id="iCenter"></div><button class="btn" @click="fetAddressName">获取当前位置和名字</button></div></template>js部分<script>export default {props:['newAddress','dataObj'],// ⽗组件传过来的地址和地址经纬度信息，data() {return {address:this.newAddress ? this.newAddress : '郑州',//保存地址的汉字名字map1: '',map:'',//保存地址的经纬度poiArr: [],//左边搜索出来的数组windowsArr: [],//信息窗⼝的数组marker: [],mapObj: "",//地图对象selectedIndex: -1,hide: false,clickType: 1,location:{P:t,Q:this.dataObj.lng,}};},mounted() {console.log(333,this.dataObj,this.location)this.mapInit()this.placeSearch(this.address)},methods: {showToast(address){this.placeSearch(address.address)console.log(444,address)this.location.P =tthis.location.Q =address.lngthis.address = address.addresslet that = this;new Window({content:"<h3>" + '当前选中地址' + "</h3>" + that.address,size: new AMap.Size(300, 0),autoMove: true,offset: new AMap.Pixel(-4, -10)}).open(that.mapObj,that.location)},cancelSave(){eventBus.$emit('cancelSave')},saveAddress(){let addressName,location;if(this.clickType==1){let address = this.poiArr[this.selectedIndex]addressName = +address.address;location = address.locationconsole.log(+address.address,address.location)}else if(this.clickType==2){console.log(this.address,this.map)addressName = this.address;location = this.map;}else if(this.clickType==3){console.log(this.address,this.map1)addressName = this.address;location = this.map1;}eventBus.$emit('saveAddress',[addressName,location])},// 经纬度转化为详细地址getAddress(){let that = this;AMap.plugin('AMap.Geocoder',function(){let geocoder = new AMap.Geocoder({radius: 100,extensions: "all"});geocoder.getAddress([that.map1.lng,t], function(status, result) {if (status === 'complete' && === 'OK') {let address = result.regeocode.formattedAddress;console.log(result.regeocode);that.address = result.regeocode.formattedAddress;// that.placeSearch(that.address)}});})},// 地图点击事件testevent(){let that = this;this.clickType = 3// var map=new AMap.Map('iCenter');//重新new出⼀个对象，传⼊参数是div的idAMap.event.addListener(this.mapObj,'click',function (e) { //添加点击事件,传⼊对象名，事件名，回调函数 that.map1 = e.lnglat;that.getAddress();setTimeout(()=>{new Window({content:"<h3>" + '当前选中地址' + "</h3>" + that.address,size: new AMap.Size(300, 0),autoMove: true,offset: new AMap.Pixel(-4, -10)}).open(that.mapObj,e.lnglat)},100)})},//创建⼀个mapmapInit() {this.mapObj = new AMap.Map("iCenter", {resizeEnable: true,zoom: 10,})this.testevent();},//根据名字地址去搜索结果placeSearch(name) {let that = this;this.hide = truevar MSearch;this.mapObj.plugin(["AMap.PlaceSearch", "AMap.ToolBar", "AMap.Scale"],() => {this.mapObj.addControl(new AMap.ToolBar())this.mapObj.addControl(new AMap.Scale())MSearch = new AMap.PlaceSearch({//构造地点查询类city: that.address //城市});AMap.event.addListener(MSearch,"complete",this.keywordSearch_CallBack) //返回地点查询结果MSearch.search(name); //关键字查询});},//结果的回调keywordSearch_CallBack(data) {console.log(111,data)var poiArr = data.poiList.poisvar resultCount = poiArr.lengththis.poiArr = poiArr; //左边要渲染的数据for (var i = 0; i < resultCount; i++) {this.addmarker(i, poiArr[i])console.log(poiArr[i])this.poiArr[i].url = this.poiArr[i].photos? this.poiArr[i].photos[0]? this.poiArr[i].photos[0].url: "": ""}this.mapObj.setFitView()},//添加marker&infowindowaddmarker(i, d) {var lngX = d.location.getLng();var latY = d.location.getLat();console.log(lngX,latY)var markerOption = {map: this.mapObj,position: new AMap.LngLat(lngX, latY)};var mar = new AMap.Marker(markerOption);this.marker.push(new AMap.LngLat(lngX, latY));var infoWindow = new Window({content: "<h3>" +'当前选中位置：'+ + "</h3>" + this.TipContents(, d.address), size: new AMap.Size(300, 0),autoMove: true,offset: new AMap.Pixel(0, -30)});console.log()this.windowsArr.push(infoWindow);var _this = this;var aa = (e) => {this.clickType = 2var obj = mar.getPosition();this.map = obj //这⾥保存的地址经纬度this.address = + d.address //这⾥保存的是地址名字infoWindow.open(_this.mapObj, obj);}AMap.event.addListener(mar, "click", aa)},TipContents(name, address) {//窗体内容if (name == "" ||name == "undefined" ||name == null ||name == " undefined" ||typeof name == "undefined") {type = "暂⽆";}if (address == "" ||address == "undefined" ||address == null ||address == " undefined" ||typeof address == "undefined") {address = "暂⽆";}var str = `地址：${address}`return str},openMarkerTipById(pointid, event) {//根据id 打开搜索结果点tipthis.clickType = 1event.currentTarget.style.background = "#CAE1FF";this.selectedIndex = pointid// this.map = this.marker[pointid]this.map1 = this.poiArr[pointid].locationconsole.log(222,this.mapObj, this.marker[pointid])console.log(this.marker[pointid],this.poiArr[pointid])this.address = this.poiArr[pointid].address + this.poiArr[pointid].namethis.windowsArr[pointid].open(this.mapObj, this.marker[pointid])},onmouseout_MarkerStyle(pointid, event) {//⿏标移开后点样式恢复event.currentTarget.style.background = ""},search() {this.windowsArr = []this.marker = []this.mapObj=''this.mapInit()this.placeSearch(this.address)}},};</script>css部分<style lang="scss">#wrap{width:100%;display: flex;#iCenter {height: 600px;position: relative;display: flex;flex: 1;}#searchWrap{width:300px;position: relative;height:600px;.searchWrap{position: absolute;width:300px;z-index: 9;display: flex;align-items: center;input{width:260px;height:24px;}button{width:36px;height:28px;}}#result {width: 300px;position: absolute;top:30px;height: 570px;z-index: 8;overflow-y: scroll;border-right: 1px solid #ccc;}}.amap_lib_placeSearch {height: 100%;overflow-y: scroll;.poibox {border-bottom: 1px solid #eaeaea;cursor: pointer;padding: 5px 0 5px 10px;position: relative;min-height: 35px;.selected {background-image: url(https:///theme/v1.3/markers/n/mark_r.png) !important;}&:hover {background: #f6f6f6;}.poi-img {float: right;margin: 3px 8px 0;width: 90px;height: 56px;overflow: hidden;}.poi-title {margin-left: 25px;font-size: 13px;overflow: hidden;}.poi-info {word-break: break-all;margin: 0 0 0 25px;overflow: hidden;p {color: #999;font-family: Tahoma;line-height: 20px;font-size: 12px;}}.poibox-icon {margin-left: 7px;margin-top: 4px;}.amap_lib_placeSearch_poi {background: url(https:///theme/v1.3/markers/n/mark_b.png)no-repeat;height: 31px;width: 19px;cursor: pointer;left: -1px;text-align: center;color: #fff;font: 12px arial, simsun, sans-serif;padding-top: 3px;position: absolute;}}}.btn{position: fixed;bottom:20px;left:50%;padding:10px;}}</style>补充知识：vue-amap ⾼德地图定位点击获取经纬度和具体地址的使⽤官⽅⽂档地址：经纬度获取只要通过点击事件就可以通过e.lnglat来获取，然后就是插件Geocoder使⽤了。

js中获取路径中携带的参数的方法

js中获取路径中携带的参数的方法下载提示：该文档是本店铺精心编制而成的，希望大家下载后，能够帮助大家解决实际问题。

文档下载后可定制修改，请根据实际需要进行调整和使用，谢谢！本店铺为大家提供各种类型的实用资料，如教育随笔、日记赏析、句子摘抄、古诗大全、经典美文、话题作文、工作总结、词语解析、文案摘录、其他资料等等，想了解不同资料格式和写法，敬请关注！Download tips: This document is carefully compiled by this editor. I hope that after you download it, it can help you solve practical problems. The document can be customized and modified after downloading, please adjust and use it according to actual needs, thank you! In addition, this shop provides you with various types of practical materials, such as educational essays, diary appreciation, sentence excerpts, ancient poems, classic articles, topic composition, work summary, word parsing, copy excerpts, other materials and so on, want to know different data formats and writing methods, please pay attention!JavaScript中获取路径中携带的参数的方法在JavaScript中，获取路径中携带的参数是一个常见的需求。

【IT专家】谷歌地图Javascript Api v3放置自动完成未在iPhone应用程序中显示正确的结果

谷歌地图Javascript Api v3放置自动完成未在iPhone应用程序中显示正确的结果谷歌地图Javascript Api v3放置自动完成未在iPhone应用程序中显示正确的结果[英]Google Map Javascript Api v3 places autocomplete Not Showing Proper Results In iPhone App I am making one Map Kit app in iPhone and used “Google Map Javascript Api v3 places autocomplete”. I followed the document given by Google code.google/apis/maps/documentation/places/autocomplete.html and created API key also as instructions by Google. 我正在iPhone中制作一个Map Kit应用程序并使用“Google Map Javascript Api v3 place autocomplete”。

我按照Google提供的文档code.google/apis/maps/documentation/places/autocomplete.html创建了API密钥,并作为Google的说明。

But the problem is that when i got the results then every time it returned “Request Denied” and shows no values to me. 但问题是,当我得到结果时,每次它返回“请求被拒绝”并且没有向我显示任何值。

1 Just check whether u are using v=3.exp in the URL. I figured it out after several attempts: 只需检查您是否在URL中使用v = 3.exp。

JavaScript遍历对象查找指定的值并返回路径

JavaScript遍历对象查找指定的值并返回路径问：JavaScript 如何查找对象中某个 value 并返回路径上所有的 key？let obj = {key1: 'str1',key2: {key3: 'str3'},key4: {key5: {key6: 'str6',key7: 'str7'},key8: 'str8'},key9: 'str9'}; 有例如上⾯这样⼀个对象，要求封装⼀个函数，传⼊对象和某个 value，返回该 value 路径上的 key。

⽐如：searchKeys(obj, "str3")，得到 "key3, key2"。

—— 来源于 @zanetti 的⼀篇我本想在该「博问」下作答，但是「博客园」提⽰我注册尚且不满 24 ⼩时，不允许我回答「博问」栏⽬的问题。

好吧，我确实是 3 ⽉16 ⽇晚上刚刚注册的「博客园」账号，既然⽆法回答那就⼲脆写第⼀篇博客。

博客的申请在 3 ⽉ 17 ⽇早上刚刚审核通过。

⾔归正传，这题要求遍历对象，⽽本质其实就是对⼀个多叉树进⾏递归。

封装函数并遍历对象第⼀步是最简单的，不必多说。

function search(object, value) {for (var key in object) {// ...}}必须先有结果既然知道这⾥需要递归，那么最重要⼀点就是必须找到结果，因为没有最终结果的递归操作肯定会「⽆法⾃拔」。

此题，当 key 对应的值等于 value 时，递归就将结束，代码如下。

if (object[key] == value) {return [key];} else {}然后思考递归现在需要分析⼀下，如果没有找到 value，object[key] 的值有哪些情况？1、⼀个不等于 value 字符串；2、⼀个对象。

JavaScript获取用户所在城市及地理位置

JavaScript获取⽤户所在城市及地理位置下⾯⼀段代码给⼤家分享js 获取⽤户所在城市，具体代码如下所述：<!doctype html><html lang="en"><head><meta charset="UTF-8"><title>获取⽤户地理位置</title><script type="text/javascript" src="./jquery-3.3.1.js"></script></head><body></body></html><script>$.getScript('/iplookup/iplookup.php?format=js',function(){alert(remote_ip_info.country);//国家alert(remote_ip_info.province);//省份alert(remote_ip_info.city);//城市});</script>JS获取⽤户地理位置<script type="text/javascript">var x = document.getElementById("x");function getLocation() {if (navigator.geolocation) {navigator.geolocation.getCurrentPosition(showPosition, showError);} else {x.innerHTML = "该浏览器不⽀持定位功能！";}}function showPosition(position) {x.innerHTML = "纬度：" + titude + "\n经度："+ position.coords.longitude;}function showError(error) {switch (error.code) {case error.PERMISSION_DENIED:x.innerHTML = "⽤户拒绝对获取地理位置的请求。

「Javascript」高德地图计算两点的坐标距离

「Javascript」高德地图计算两点的坐标距离前言：需要根据用户的地理位置，计算出边的店家和商家。

这时候使用到了高德地图，然后利用坐标进行区域内的计算。

规则初始的计算，用的是两点的方式，左上和右下来确定距离，后来发现在执行的了一段时间后，有一些区域不是太好，偏差比较大，所以就修改成了，以中心点计算距离的方式来确定所归某个区域。

地图高德地图API【JS】版本代码//区域中心点以json的形式来写的大家可以换成自己想用的格式var xyCenter =[{sign:1001,lng:116.469637,lat:39.894197},{sign:1002,lng:116.383066,lat:39.9623 53},{sign:1003,lng:116.341653,lat:39.8707}];//存放每个地点所计算出来的距离var resArray = new Array();//填写计算距离的结果地点与距离var belongArea = function(lnglat){for(i=0;i<xyCenter.length;i++){resArray[i]=new Array();resArray[i][sign]=xyCenter[i].sign;var endLngLat = new AMap.LngLat(xyCenter[i].lng,xyCenter[i].lat);resArray[i][range]=parseInt(Math.abs(endLngLat.distance(lnglat)));//console.log(resArray[i][range]);}};//取最终的归属代号大家可以修改成自己的，本程序所用1001 1002... var maxRes = function(){var tmp=resArray[0];for(i=0;i<resArray.length-1;i++){if(resArray[i][range]<resArray[i+1][range]){tmp = i;resArray[i+1] = resArray[i];}else{tmp = i+1;}}return resArray[tmp][sign];};//调用方式//获取LngLatvar startLngLat = new AMap.LngLat(116.319766,39.911448);//传入到计算方法belongArea(startLngLat);//获取到最终结果alert(maxRes());结论参考高德地图API的基础类里的LngLat类核心就是我们利用中心点计算出用户的4个点的方位。

JS如何调用高德地图

JS如何调⽤⾼德地图最近配合后台做管理系统，需要前端⽤原⽣html页⾯嵌⼊到后台，于是乎...记录下原⽣JS怎么使⽤⾼德地图吧⼀.获取⾼德地图的key1.⼿机号登录⾼德开放平台2.3、选择web服务，然后提交，就会⽣成key的值⼆.定义放地图的容器，并设置宽⾼<style>#oneMap {width: 100%;height: 800px;}</style><div id="oneMap"></div>注意：容器的ID 和第三步初始化地图的 ID保持⼀致三.在线加载 JSAPI以及地图初始化<script type="text/javascript"src="https:///maps?v=1.4.15&key=您申请的key值"></script>// 地图初始化<script type="text/javascript">var map = new AMap.Map('oneMap', {center:[117.000923,36.675807],zoom:11});</script>注意：key = 赋值⾃⼰申请的key值四. 效果图如下彩蛋：在vue⾥⾯调⽤⾼德地图demo直接上全部代码：<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>⾼德地图</title><style>#oneMap {width: 100%;height: 800px;}</style></head><body><div id="oneMap"></div><script src="./js/vue.min.js"></script><script type="text/javascript"src="https:///maps?v=1.4.15&key=8bcd5d53aee035144d261311c2aba4a4&plugin=AMap.Autocomplete,AMap.Geocoder,AMap.MouseTool"></script> <script>var app = new Vue({el: '#oneMap',data: function () {return {}},mounted: function () {this.initMap();},created: function () {},methods: {// 初始化⾼德地图initMap: function () {var map = new AMap.Map('oneMap', {center: [117.000923, 36.675807],zoom: 11});}}})</script></body></html>注意：在mounted中初始化地图不⾜之处，欢迎各位⼤佬留⾔指点！。

javascript事件查询及函数查询（网络收藏）

javascript事件查询及函数查询（⽹络收藏）javascript事件查询综合(转)javascript事件查询综合click() 对象.click() 使对象被点击。

closed 对象.closed 对象窗⼝是否已关闭true/falseclearTimeout(对象) 清除已设置的setTimeout对象clearInterval(对象) 清除已设置的setInterval对象confirm("提⽰信息") 弹出确认框，确定返回true取消返回falsecursor:样式更改⿏标样式 hand crosshair text wait help default auto e/s/w/n-resizeevent.clientX 返回最后⼀次点击⿏标X坐标值；event.clientY 返回最后⼀次点击⿏标Y坐标值；event.offsetX 返回当前⿏标悬停X坐标值event.offsetY 返回当前⿏标悬停Y坐标值document.write(stModified) ⽹页最后⼀次更新时间document.ondblclick=x 当双击⿏标产⽣事件document.onmousedown=x 单击⿏标键产⽣事件document.body.scrollTop; 返回和设置当前竖向滚动条的坐标值，须与函数配合,document.body.scrollLeft; 返回和设置当前横向滚动务的坐标值，须与函数配合，document.title document.title="message"; 当前窗⼝的标题栏⽂字document.bgcolor document.bgcolor="颜⾊值"; 改变窗⼝背景颜⾊document.Fgcolor document.Fgcolor="颜⾊值"; 改变正⽂颜⾊document.linkcolor document.linkcolor="颜⾊值"; 改变超联接颜⾊document.alinkcolor document.alinkcolor="颜⾊值"; 改变正点击联接的颜⾊document.VlinkColor document.VlinkColor="颜⾊值"; 改变已访问联接的颜⾊document.forms.length 返回当前页form表单数document.anchors.length 返回当前页锚的数量document.links.length 返回当前页联接的数量document.onmousedown=x 单击⿏标触发事件document.ondblclick=x 双击⿏标触发事件defaultStatus window.status=defaultStatus; 将状态栏设置默认显⽰function function xx(){...} 定义函数isNumeric 判断是否是数字innerHTML xx=对象.innerHTML 输⼊某对象标签中的html源代码innerText divid.innerText=xx 将以div定位以id命名的对象值设为XXlocation.reload(); 使本页刷新，target可等于⼀个刷新的⽹页Math.random() 随机涵数,只能是0到1之间的数,如果要得到其它数,可以为*10,再取整Math.floor(number) 将对象number转为整数，舍取所有⼩数Math.min(1,2) 返回1,2哪个⼩Math.max(1,2) 返回1,2哪个⼤navigator.appName 返回当前浏览器名称navigator.appVersion 返回当前浏览器版本号navigator.appCodeName 返回当前浏览器代码名字erAgent 返回当前浏览器⽤户代标志onsubmit onsubmit="return(xx())" 使⽤函数返回值opener opener.document.对象控制原打开窗体对象prompt xx=window.prompt("提⽰信息","预定值"); 输⼊语句parent parent.框架名.对象控制框架页⾯return return false 返回值random 随机参数（0⾄1之间）reset() form.reset(); 使form表单内的数据重置split("") string.split("") 将string对象字符以逗号隔开submit() form对象.submit() 使form对象提交数据String对象的 charAt(x)对象反回指定对象的第多少位的字母lastIndexOf("string") 从右到左询找指定字符，没有返回-1indexOf("string") 从左到右询找指定字符，没有返回-1LowerCase() 将对象全部转为⼩写UpperCase() 将对象全部转为⼤写substring(0,5) string.substring(x,x) 返回对象中从0到5的字符setTimeout("function",time) 设置⼀个超时对象setInterval("function",time) 设置⼀个超时对象toLocaleString() x.toLocaleString() 从x时间对象中获取时间，以字符串型式存在typeof(变量名) 检查变量的类型，值有：String,Boolean,Object,Function,Underfinedwindow.event.button==1/2/3 ⿏标键左键等于1右键等于2两个键⼀起按为3window.screen.availWidth 返回当前屏幕宽度(空⽩空间)window.screen.availHeight 返回当前屏幕⾼度(空⽩空间)window.screen.width 返回当前屏幕宽度(分辨率值)window.screen.height 返回当前屏幕⾼度(分辨率值)window.document.body.offsetHeight; 返回当前⽹页⾼度window.document.body.offsetWidth; 返回当前⽹页宽度window.resizeTo(0,0) 将窗⼝设置宽⾼window.moveTo(0,0) 将窗⼝移到某位置window.focus() 使当前窗⼝获得焦点window.scroll(x,y) 窗⼝滚动条坐标，y控制上下移动，须与函数配合window.open() window.open("地址","名称","属性")属性:toolbar(⼯具栏),location(地址栏),directions,status(状态栏),menubar(菜单栏),scrollbar(滚动条),resizable(改变⼤⼩), width(宽),height(⾼),fullscreen(全屏),scrollbars(全屏时⽆滚动条⽆参数,channelmode(宽屏),left(打开窗⼝x坐标),top(打开窗⼝y坐标)window.location = 'view-source:' + window.location.href 应⽤事件查看⽹页源代码;a=new Date(); //创建a为⼀个新的时期对象y=a.getYear(); //y的值为从对象a中获取年份值两位数年份y1=a.getFullYear(); //获取全年份数四位数年份m=a.getMonth(); //获取⽉份值d=a.getDate(); //获取⽇期值d1=a.getDay(); //获取当前星期值h=a.getHours(); //获取当前⼩时数m1=a.getMinutes(); //获取当前分钟数s=a.getSeconds(); //获取当前秒钟数对象.style.fontSize="⽂字⼤⼩";单位：mm/cm/in英⼨/pc帕/pt点/px象素/em⽂字⾼1in=1.25cm1pc=12pt1pt=1.2px(800*600分辩率下)⽂本字体属性：fontSize⼤⼩family字体color颜⾊fontStyle风格，取值为normal⼀般,italic斜体,oblique斜体且加粗fontWeight加粗,取值为100到900不等,900最粗,light,normal,boldletterSpacing间距,更改⽂字间距离,取值为,1pt,10px,1cmtextDecoration:⽂字修饰;取值,none不修饰,underline下划线,overline上划线background:⽂字背景颜⾊,backgroundImage:背景图⽚,取值为图⽚的插⼊路径点击⽹页正⽂函数调⽤触发器：1.onClick 当对象被点击2.onLoad 当⽹页打开,只能书写在body中3.onUnload 当⽹页关闭或离开时,只能书写在body中4.onmouseover 当⿏标悬于其上时5.onmouseout 当⿏标离开对象时6.onmouseup 当⿏标松开7.onmousedown 当⿏标按下键8.onFocus 当对象获取焦点时9.onSelect 当对象的⽂本被选中时10.onChange 当对象的内容被改变11.onBlur 当对象失去焦点onsubmit=return(ss())表单调⽤时返回的值直线 border-bottom:1x solid black虚线 border-bottom:1x dotted black点划线 border-bottom:2x dashed black双线 border-bottom:5x double black槽状 border-bottom:1x groove black脊状 border-bottom:1x ridge black。

基于高德地图开发公交查询系统项目在JavaScript课程教学中的应用

基于高德地图开发公交查询系统项目在JavaScript课程教学
中的应用
吴国华
【期刊名称】《电脑知识与技术》
【年(卷),期】2018(014)005
【摘要】JavaScript语言编程是职业院校《网页编程》课程中的基础组成部分,教学中开发项目的选择对于枯燥的语言编程学习起到举足轻重的作用.该文基于高德地图JavaScript API程序为开发环境,以开发公交查询系统项目为案例,使学生有效地掌握JavaScript语言编程,激发学生自主学习的兴趣,培养学生软件项目开发的能力.
【总页数】3页(P162-163,170)
【作者】吴国华
【作者单位】广东省财政职业技术学校,广东广州510445
【正文语种】中文
【中图分类】G424
【相关文献】
1.企业项目化教学法在基于Java技术的Web应用开发课程教学中的应用与实践[J], 李晓明
2.“项目驱动法”在JavaScript课程教学中的应用 [J], 李桂芹
3.基于游戏开发的"项目驱动法"在JavaScript课程教学中的应用研究 [J], 伍晓圆
4.企业项目化教学法在基于Java技术的Web应用开发课程教学中的应用与实践[J], 李晓明
5.设计竞赛项目在工业设计实践课程教学中的应用——以《产品系统开发设计》课程为例 [J], 李永斌;韩卫国
因版权原因，仅展示原文概要，查看原文内容请购买。