Question

当使用Google Map Custom Overlay添加pop over输入文本框时，如下所示，当我尝试单击IE Edge 15上的输入框（Haven在其他IE版本上测试）时，我可以＆＃ 39; t点击它并开始输入，好像它不会将焦点设置在输入框上。

它确实适用于Chrome。

CustomMarker.prototype.onAdd = function() {
  var self = this;
  var div = this.div;
  if (!div) {
    // Generate marker html
    div = this.div = document.createElement('div');
    div.className = 'custom-marker';
    div.style.position = 'absolute';
    div.innerHTML = '<span><input type="text" value="asfd" style="padding:10px;font-size:18px;" /></span>';
    var innerDiv = document.createElement('div');
    innerDiv.className = 'custom-marker-inner';

    div.appendChild(innerDiv);

    if (typeof(self.args.marker_id) !== 'undefined') {
      div.dataset.marker_id = self.args.marker_id;
    }

    google.maps.event.addDomListener(div, "click", function(event) {
      google.maps.event.trigger(self, "click");
    });

    var panes = this.getPanes();
    panes.overlayImage.appendChild(div);
  }
};

Full example code here - jsfiddle

我想知道上面的实现是否错误，或者这是Google Map的错误？ [编辑：或者有解决方法吗？]

Answer 1

我把你的小提琴分开了。它可能有点hacky，但我已经更新了click事件以专注于输入：

google.maps.event.addDomListener(div, "click", function(event) {
    google.maps.event.trigger(self, "click");
    event.target.focus();
});

https://jsfiddle.net/ng4hxqfs/5/

带有INPUT文本的Google Map Custom Overlay无法在IE Edge上运行

1 个答案: