11-13日学习过程中较难理解的代码

最新推荐文章于 2022-07-26 20:18:45 发布

KardusenIII

最新推荐文章于 2022-07-26 20:18:45 发布

阅读量171

点赞数

Geolocation API 的主要方法是 getCurrentPosition，它用来获得用户的位置。
下面是一个简单的地理定位实例，可返回用户位置的经度和纬度:

var x=document.getElementById("demo");
function getLocation(){
  if (navigator.geolocation){
    navigator.geolocation.getCurrentPosition(showPosition);
  }
  else{
    x.innerHTML="该浏览器不支持获取地理位置。";
  }
}

function showPosition(position){
  x.innerHTML="纬度: " + position.coords.latitude + 
  "<br>经度: " + position.coords.longitude;    
}

实例解析:
检测是否支持地理定位。
如果支持，则运行 getCurrentPosition() 方法。如果不支持，则向用户显示一段消息。
如果 getCurrentPosition() 运行成功，则向参数 showPosition 中规定的函数返回一个 coordinates 对象。
showPosition() 函数获得并显示经度和纬度。

如果 getCurrentPosition() 运行成功，则 getCurrentPosition() 方法返回对象。始终会返回 latitude、longitude 以及 accuracy 属性。如果可用，则会返回其他下面的属性：
coords.latitude：十进制数的纬度
coords.longitude：十进制数的经度
coords.accuracy：位置精度
coords.altitude：海拔，海平面以上以米计
coords.altitudeAccuracy：位置的海拔精度
coords.heading：方向，从正北开始以度计
coords.speed：速度，以米/每秒计
timestamp：响应的日期/时间

以下是其他代码

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8"> 
<title>W3Cschool教程(w3cschool.cn)</title>
<style type="text/css">
  #div1 {width:350px;height:70px;padding:10px;border:1px solid #aaaaaa;}
</style>
<script>
  function allowDrop(ev){
    ev.preventDefault();
}

  function drag(ev){//拖动
    ev.dataTransfer.setData("Text",ev.target.id);//这里设置的是被拖动数据的类型以及内容，“Text”是数据类型，值是可拖动元素的id
}

  function drop(ev){//放置
    ev.preventDefault();//默认是不允许拖放数据的，所以要阻止默认的处理方式
    var data=ev.dataTransfer.getData("Text");//被拖动数据
    ev.target.appendChild(document.getElementById(data));//
}
</script>
</head>
<body>

  <p>拖动 w3cschool.cn 图片到矩形框中:</p>

  <div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
  <br>
  <img id="drag1" src="/statics/images/logo.png" draggable="true" ondragstart="drag(event)" width="336" height="69">//要先把元素设置为允许拖动

</body>
</html>

拖动什么 - ondragstart 和 setData()
放到何处 - ondragover
进行放置 - ondrop

KardusenIII

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
11-13日学习过程中较难理解的代码

Geolocation API 的主要方法是 getCurrentPosition，它用来获得用户的位置。下面是一个简单的地理定位实例，可返回用户位置的经度和纬度: var x=document.getElementById("demo");function getLocation(){ if (navigator.geolocation){ navigator.geolo...
复制链接

扫一扫