嵌入在iframe中的google maps的粘性光標

Question

當我將它嵌入到iframe中時，我遇到了google maps（api v3）的一些問題。

當我點擊地圖上的某個地方時，拖動它直到光標離開iframe，然後鬆開鼠標按鈕，然後當我將地圖移動到地圖上時，地圖將粘住光標，即使我不是再次按下鼠標按鈕。

http://my.brandtr.ee/public/tmp/test-iframe.html

看來，如果在地圖上被嵌入iFrame中，那麼「鼠標鬆開」事件不是由地圖釣到如果用戶釋放的IFRAME以外鼠標按鈕。 只有webkit瀏覽器（chrome 23，safari 6）和IE纔會出現此問題。 Firefox工作正常。

有沒有人有這個問題？這是一直在竊聽我幾天...

在此先感謝。

Answer 1

我不完全確定谷歌地圖爲了停止拖動地圖而依靠什麼事件，但只是在演示演示時，我注意到它在iframe中的mouseup時停止。如果您在iframe的mouseout上模擬此事件，則Google地圖會認爲您放棄了該地圖，並停止拖動。

我想這個代碼從控制檯內，它工作正常：

var iframe = document.getElementsByTagName('iframe')[0]; 
iframe.addEventListener('mouseout', function(e){ 
    var doc = this.contentDocument || this.contentWindow; // wk/moz vs. ie 
    doc = doc.document || doc; // opera 
    if (doc.createEvent) { 
     var evt = doc.createEvent('MouseEvents'); 
     evt.initMouseEvent('mouseup', true, false, window, 
      0, e.screenX, e.screenY, e.clientX, e.clientY, 
      false, false, false, false, 0, null 
     ); 
     doc.getElementsByTagName('body')[0].dispatchEvent(evt); 
    } else if (doc.createEventObject) { // legacy ie 
     var evt = doc.createEventObject(e); 
     doc.getElementsByTagName('body')[0].fireEvent('mouseup', e); 
    } 
}); 

這在FF，Safari瀏覽器，Chrome瀏覽器和Opera。我在IE中快速查看了您的頁面，但未應用修復程序。然而，它看起來並不像在那裏發生拖拽問題，所以它可能不值得提供這種情況。祝你好運！