百度地图自定义覆盖物，在手机上无法监听click事件

百度地图自定义覆盖物，在手机上无法监听click事件

最近在做手机web端集成百度地图遇到了个坑儿；手机端不支持自定义覆盖物的click事件；
1.自带的marker是支持的（marker不属于自定义覆盖物）

// An highlighted block
var marker = new BMap.Marker(hisPlayView[i],{title:i.toString()});
marker.addEventListener('click',func);
	function func(){
	alert();
}

2.引用百度开源库也可以
引入js：http://api.map.baidu.com/library/EventWrapper/1.2/src/EventWrapper.js

// An highlighted block
 var mySquare = new SquareOverlay(point1, '金地', '待定','250','1');//mySquare 属于自定义覆盖物
 map.addOverlay(mySquare);
BMapLib.EventWrapper.addDomListener(mySquare ._div, "touchend", function(e){
        // console.log(e);
});

3.直接在覆盖物初始化里面添加监听事件
栗子如下面代码中我注释的那里（如果不在意误触是可以用的touchend方法）；
**但是以上方法都不满足我的需求！！**以上方法会造成地图拖动时只要一碰到覆盖物就会执行click事件；
我的需求是拖动的时候没效果，点击的时候才会触发；以下直接上我的实例代码：

// An highlighted block
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=yourkey"></script>
<script type="text/javascript" src="/js/jquery-1.8.3.min.js"></script>
<div id="allmap"></div>
<script type="text/javascript">
    // 定义自定义覆盖物的构造函数
    function SquareOverlay(center, projectName, pirce,projectId,projectType){
        this._center = center;
        this._projectName = projectName;
        this._pirce = pirce;
        this._projectId = projectId;
        this._projectType = projectType;
    }
    // 继承API的BMap.Overlay
    SquareOverlay.prototype = new BMap.Overlay();
    // 实现初始化方法
    SquareOverlay.prototype.initialize = function(map){
        // 保存map对象实例
        this._map = map;
        // 创建div元素，作为自定义覆盖物的容器
        var div = document.createElement("div");
        div.style.position = "absolute";
        // 可以根据参数设置元素外观
        div.style.width = 60 + "px";
        div.style.height = 50 + "px";
//        div.style.background = this._color;
        var pNames = document.createElement("span");
        pNames.appendChild(document.createTextNode(this._projectName));
        pNames.setAttribute("projectId",this._projectId);
        pNames.setAttribute("projectType",this._projectType);
        div.appendChild(pNames)
        var pPrice = document.createElement("span");
        pPrice.appendChild(document.createTextNode(this._pirce));
        div.appendChild(pPrice);
//        div.addEventListener("touchend",function (e) {///当时使用后来被放弃了，因为这要一触碰就会跳转，影响体验
//            var tagetSpan = $(e.currentTarget).find('span').eq(0);
//            var projectId =   $(tagetSpan).attr('projectId');
//            var projectType =  $(tagetSpan).attr('projectType');
//            window.location.href= '/fang1/'+projectId+'-'+projectType+'.htm';
//        })
        div.addEventListener("click", function(e){ //此事件如果不禁用map的拖拽是不好用的，禁用了才会执行
            var tagetSpan = $(e.currentTarget).find('span').eq(0);
            var projectId =   $(tagetSpan).attr('projectId');
            var projectType =  $(tagetSpan).attr('projectType');
            window.location.href= '/fang1/'+projectId+'-'+projectType+'.htm';
        });

        // 将div添加到覆盖物容器中
        map.getPanes().markerPane.appendChild(div);
        // 保存div实例
        this._div = div;
        // 需要将div元素作为方法的返回值，当调用该覆盖物的show、
        return div;
    }
    // 实现绘制方法
    SquareOverlay.prototype.draw = function(){
        // 根据地理坐标转换为像素坐标，并设置给容器
        var position = this._map.pointToOverlayPixel(this._center);
        this._div.style.left = position.x+ "px";
        this._div.style.top = position.y + "px";
    }
    // 实现显示方法
    SquareOverlay.prototype.show = function(){
        if (this._div){
            this._div.style.display = "";
        }
    }
    // 实现隐藏方法
    SquareOverlay.prototype.hide = function(){
        if (this._div){
            this._div.style.display = "none";
        }
    }
    // 初始化地图
    var map = new BMap.Map("allmap");    // 创建Map实例
    var point = new BMap.Point(123.438973, 41.798756);
    map.centerAndZoom(point, 11);  // 初始化地图,设置中心点坐标和地图级别
    map.setCurrentCity("sy");          // 设置地图显示的城市 此项是必须设置的
    map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
    //TODO: click 事件 移动端会被屏蔽
    map.addEventListener("click", function (e) {
        console.log("该点的经纬度为：" + e.point.lng + " , " + e.point.lat);
    });
    // TODO: 触摸移动时触发此事件 此时开启可以拖动。虽然刚初始化该地图不可以拖动，但是可以触发拖动事件。
    map.addEventListener("touchmove", function (e) {
        map.enableDragging();
    });
    // TODO: 触摸结束时触发次此事件  此时开启禁止拖动
    map.addEventListener("touchend", function (e) {
        map.disableDragging();
    });   
     // 初始化地图 禁止拖动   注：虽禁止拖动，但是可以出发拖动事件
    map.disableDragging();
    // 添加自定义覆盖物
    var point1 = new BMap.Point(123.438973, 41.798756);
    var point2 = new BMap.Point(123.5094, 41.835744);
    var mySquare = new SquareOverlay(point1, '金地', '待定','250','1');
    map.addOverlay(mySquare);
    var mySquare = new SquareOverlay(point2, '万科', '3000元/㎡','250','1');
    map.addOverlay(mySquare);
</script>

以上就不会受到误触的困扰了，同时非常感谢大神们的指引；
本文主要是对于 （连接：https://blog.csdn.net/Davis_Dxs/article/details/82425211 ）的一个应用吧，希望对涉及地图的朋友提供些帮助