2014-04-05 46 views
-1

我纔剛剛未定義:如何獲得鼠標座標在drop事件的Javascript/jQuery的

myele.bind('drop', function (e) { 
      console.log("Dropped"); 
      if (e.pageX || e.pageY) { 
       //store 
      } 
      else if (e.clientX || e.clientY) { 
       //store 
      } 
      console.log("XPOS: " + e.clientX + " YPOS: " + e.pageY); 
      return false; 
     }); 

輸出:

丟棄 XPOS:未定義YPOS:未定義

編輯

http://jsfiddle.net/fBT7X/2/

+1

提供複製您的問題 –

+0

@ A.Wolff一個的jsfiddle添加的jsfiddle鏈接 –

回答

1

jQuery的包裝了原來放置事件到屬性稱爲originalEvent所以你必須訪問獲得頁面/客戶端屬性

myele.bind('drop', function (e) { 
    console.log("Dropped"); 
    if (e.originalEvent.pageX || e.originalEvent.pageY) { 
     //store 
    } 
    else if (e.originalEvent.clientX || e.originalEvent.clientY) { 
     //store 
    } 
    console.log("XPOS: " + e.originalEvent.clientX + " YPOS: " + e.originalEvent.pageY); 
    return false; 
}); 

JSFIDDLE DEMO拖動綠框紅色

當你得到一個未定義在您認爲具有所需內容的對象上,將該對象記錄到控制檯並查看它。在這種情況下,只要登錄事件對象,並通過屬性看

console.log(e); 
    jQuery.Event {originalEvent: MouseEvent, type: "drop", isDefaultPrevented: function, timeStamp: 1396687578486, jQuery110104013205280061811: true…} 
    altKey: false 
    bubbles: true 
    cancelable: true 
    ctrlKey: false 
    currentTarget: div#e 
    data: null 
    delegateTarget: div#e 
    eventPhase: 2 
    handleObj: Object 
    isDefaultPrevented: function returnFalse() { 
    jQuery110104013205280061811: true 
    metaKey: false 
    originalEvent: MouseEvent <--- 
     altKey: false 
     bubbles: true 
     button: 0 
     cancelBubble: false 
     cancelable: true 
     charCode: 0 
     clientX: 24 <--- 
     clientY: 64 <--- 
     ... 
    relatedTarget: null 
    ... 
相關問題