2015-01-12 94 views
1

我有以下腳本。我需要獲取圖像循環結束時發送到我的電子郵件的每個鼠標單擊座標的座標。有人可以幫助我嗎?我在這方面很新,並且正在嘗試執行一些我的記憶任務(我以前在Matlab中編寫過)在線。任何幫助都感激不盡。獲取每次點擊的鼠標座標

這裏是我的腳本:

<head> 
<title>Practice2</title> 
<link type="text/css" rel="Stylesheet" href="MemStyle.CSS"> 
<script type = "text/javascript">   
var x=0; 
function changeImage() 
{ 
if (x == images.length){ 
return;  
} 

document.getElementById("img").src=images[x] 
x++; 
} 

var images = ["S2b.jpg", "S3b.jpg", "S4b.jpg", "S5b.jpg", "S1b.jpg"];  

</script> 
</head> 
<body> 
<div id="MemImg"> 
<button onclick="changeImage()" > 
<img id="img" width="700px" height="700px" > 
</button> 
</div> 
</body> 
+1

因此,所有你需要的是一個事件處理程序,學習如何事件對象工作,event.pageX做什麼,如何用ajax發送到服務器,如何設置郵件服務器,以及如何從Web服務器發送郵件。你想讓我們爲你編碼? – adeneo

+0

不對不起,我只需要鼠標的座標。其他一切都建立起來了!對不起,如果這不清楚。 – Nahidz

回答

0

你可以用鼠標非常簡單的數學座標。
你打算將事件處理程序附加到圖像標記嗎?如果是這種情況,您可以複製下面的代碼。
我知道如果您不瞭解
JavaScript事件,DOM模型等,您會感到非常沮喪。但是,如果您花費了一些努力,但不是很難理解您是否花費了一些努力。
我只是假設basse點(0,0)將是圖像標籤所在的位置。
(如果圖像標記位於(34,34),我假設(34,34)將是(0,0))

<script> 
    function sendMouseCoodinate(evt){ 
     //if you just want send absolute moouseCoodinate, send evt.clientX, evt.clientY 
     // sendToMyMail(evt.clientX, evt.clientY); 
     //or you can send relative mouseCoodinate of image tag. 
     var coodinateX = parseInt(evt.clientX) - this.getBoundingClientRect().left; 
     var coodinateY = parseInt(evt.clientY) - this.getBoundingClientRect().top; 
     // here you can send coodinateX, coodianteY value to your mail server 

    } 
    window.addEventListener("DOMContentLoaded",function(){ 
     document.getElementById("imgArea").addEventListener("mousedown", sendMouseCoodinate,false); 
    }); 
</script> 
<img id="imgArea">