HTML5网站建设showItems的调用
发布时间:2014-11-10 5:50:14

重要的代码片断
该程序的HTML代码包含了一些div容器元素,它们将在稍后用于容纳消息(id='items')及地图(id='map')。如前所述,textarea元素包含了新的placeholder属性,可以进一步提升用户亲和度。相关单击事件的监听器被直接绑定至3个按钮元素:
Geonotes
宁波网站建设认为
Save
Drawallitemsonmap
ImportDemoData
JavaScript代码定义了一个辅助功能函数及3个全局变量:
function$(id){returndocument.getElementByld(id);}varmap;varmy_pos;vardiaryltem={id:0,pos:0,ts:0,msg:<9}
节中介绍了函数$。它在这里也可以为你节省许多打字功夫,并让代码更容易阅读。变量map指向用于显示GoogleMaps的HTML区域。myjpos包含了调用脚本时的当前位置,同时也用于计箅距离。diaryltem表示每条记录的结构:每条记录都被分配了一个ID(id)、当前位置信息(pos)、一个时间戳(ts)以及文本域中输入的注释(msg)〇在页面加载完成时,我们判断出当前位置并显示已有的记录:
window.onload=functionQ{if(navigator.geolocation){navigator.geolocation.getCurrentPosition(function^pos){mypos=pos;showItemsQ;},posError,
{enableHighAccuracy:true,maximumAge:}
});
showItems();
if(localStorage.length>0){drawAHItemsQ;调用getCurrentPosition()函数会激活enableHighAccuracy选项,并将已判定位置的过期时间设为一分钟。若成功定位,最新的位置数据将被传给此前定义好的全局变量my」)0s,接着调用函数showltems0丨若定位失败,则会调用函数posErrorQ,它在对话窗口中输出相应错误信息。若localStorage中的信息数童大于0,我们将执行函数drawAllItems(),将已储存的地点显示在GoogleMaps上。
本文由乐华网络编辑,转载请注明出处
宁波网站建设www.leseo.net