Question

我正在开发一个项目，我需要将google地图标记拖动到某个dom元素（例如我的代码中的img），当我释放鼠标时，我需要触发一个函数。

我是这样做的：

<!DOCTYPE html>
<html>

<head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <style type="text/css">
        html { height: 100% }body { height: 100%; margin: 0; padding: 0 }#map-canvas
        { height: 100% }
    </style>
    <script src="http://maps.googleapis.com/maps/api/js?sensor=false">
    </script>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js">
    </script>
    <script type="text/javascript">
        var map;
        var tempMarker;
        function initialize() {
            var mapOptions = {
                center: new google.maps.LatLng(35.861660, 104.1953970),
                zoom: 4,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };
            map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);
            addMarkers();
        }
        function addMarkers() {
            var marker0 = new google.maps.Marker({
                position: new google.maps.LatLng(32.04, 118.78),
                map: map,
                draggable: true,
                raiseOnDrag: false
            });
            google.maps.event.addListener(marker0, 'dragstart',
            function(event) {
                tempMarker = this.getPosition();
                var addToPlan = "<div style='width: 130px; height: 38px;position: absolute;right: 50px;bottom: 50px;' id='addToPlan' ><img id='add_img' src='http://www.w3schools.com/html/img_w3slogo.gif' /></div>";
                $(document.body).append(addToPlan);
                $('#add_img').mouseup(function() {
                    alert('mouseup');
                });
            });
            google.maps.event.addListener(marker0, 'dragend',
            function(event) {
                this.setPosition(tempMarker);
                // $('#addToPlan').remove();
            });
        }

        google.maps.event.addDomListener(window, 'load', initialize);
    </script>
</head>

<body>
    <div id="map-canvas" />
</body>

</html>

不幸的是，它在IE7上不起作用。如果将标记拖动到图片上，它将不会触发该功能，但是，如果直接单击图片，则可以捕获鼠标事件！

注意：当拖动结束时我没有删除img元素，因此您可以直接单击img，但是，如果将标记拖动两次，它就无法捕获mouseup事件。

Answer 1

无法触发mouseup，mousemove就像mouseup一样。

无法在IE7中捕获mouseup事件

1 个答案: