Question

我试图让用户在双击时输入标记的标题。我似乎无法让它工作。

如何通过双击而不是单击来显示提示窗口？

这可能在HTML5 / Javascript中吗？我们还没有学过jQuery。

    <!DOCTYPE html>
<html>
<head>
<title>Boca Raton Map</title>
<meta charset="UTF-8">
<style>
header {font-family:Georgia,"Times New Roman",serif;
    font-size:20px;
    display:block;

}
</style>
<script type="text/javascript" charset="UTF-8" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" charset="UTF-8">
var locations = [
    [26.3583333, -80.0833333, "Boca Raton, FL"],
        ]
function init() 
{
 makemap(locations[0][0],locations[0][1]);
 document.getElementById("header").innerHTML = "Base location is "+locations[0][2];
}

var listener;
var map;
var markersArray =[];
var blatlng; 
var myOptions; 

function makemap(mylat,mylong) 
{

 blatlng = new google.maps.LatLng(mylat,mylong);
 // alert("latlng is "+latlng);
 myOptions = {
      zoom: 14,
      center: blatlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
    };
 map = new google.maps.Map(document.getElementById("place"), myOptions);

 listener = google.maps.event.addListener(map, 'click', function(event){
            checkit(event.latLng);                                   
            }); 
}

//function disp_prompt()
 //{
  //var mTitle=prompt("Please enter a marker title:", "Marker Title");
 //}

function checkit(clatlng) 
{
    var mTitle=prompt("Please enter a marker title:", "Marker Title")
    var distance = dist(clatlng,blatlng);
    distance = Math.floor((distance+.005)*100)/100;
    var distanceString = String(distance)+" miles";
    marker = new google.maps.Marker({
                                     position: clatlng,
                                     title: mTitle,
                                     map: map });
    //markersArray.push(marker);
    //--
    //document.getElementById("answer").innerHTML  = 
    // "The distance from base to most recent marker is "+String(distance) +" miles.";
}

function dist(point1, point2) 
{
      //spherical law of cosines
      //var R = 6371; // km
      var R =  3959; // miles
      var lat1 = point1.lat()*Math.PI/180;
      var lat2 = point2.lat()*Math.PI/180 ;
      var lon1 = point1.lng()*Math.PI/180;
      var lon2 = point2.lng()*Math.PI/180;

        var d = Math.acos(Math.sin(lat1)*Math.sin(lat2) + 
                  Math.cos(lat1)*Math.cos(lat2) *
                  Math.cos(lon2-lon1)) * R;
    return d;     
}


//--
</script>
</head>
<body onLoad="init();" onclick="disp_prompt()">
<header id="header">Base location is your current geolocation.</header>
<div id="place" style="width:600px; height:400px"></div>
<div id="answer"></div>
</form>
</body>
</html>

双击[Google地图]上的提示窗口

0 个答案: