Javascriptでevent.clientXのエラーが発生する

Question

私が作成しているプログラムは、マウスがダウンしたときにマウスのXとYの位置を読み取るプログラムです。エラーが発生したコードは以下の通りです：

function updateLocation(event) { 
    setTimeout(function(event){ 
     var X = event.clientX; 
     var Y = event.clientY; 
    },300); 
} 

クローム、オペラ、Firefox、およびエッジのすべてが言う「捕捉されない例外TypeErrorを：未定義のプロパティを読み取ることができません 『clientX』（...）は、」私は理解していないことさえありますw3schools.comからevent.clientXのソースコードをコピーしても、それでもエラーが発生します。私はコードを書き直そうとしましたが、eventをsetTimeout()に渡すだけでしたが、機能には何も効きませんでした。誰かが私を助けてください、それはイライラしています。ここで

は、私が試したすべてのもののリストです：

function updateLocation(event) { 
    setTimeout(function(){ 
     var X = event.clientX; 
     var Y = event.clientY; 
    },300); 
} 

---

function updateLocation() { 
    setTimeout(function(event){ 
     var X = event.clientX; 
     var Y = event.clientY; 
    },300); 
} 

---

function updateLocation(event) { 
    alert(event.clientX); 
} 

---

function updateLocation(event) { 
    setTimeout(function(event){ 
     var X = event.windowX; 
     var Y = event.windowY; 
    },300); 
} 

---

それがトリガーされます際にはパラメータが渡されませんので、

function updateLocation(event) { 
    setTimeout(function(){ 
     var X = event.windowX; 
     var Y = event.windowY; 
    },300); 
} 

---

function updateLocation() { 
    setTimeout(function(event){ 
     var X = event.windowX; 
     var Y = event.windowY; 
    },300); 
} 

Answer 1

setTimeoutコールバック関数は、任意の引数を持つべきではありません。だからこそ、それは未定義となっています。

次のように関数から削除すると、期待どおりに機能します。

以下のコードをご覧ください。

function updateLocation(event) { 
 
    setTimeout(function(){ 
 
     var X = event.clientX; 
 
     var Y = event.clientY; 
 
     console.log(X + ', ' + Y); 
 
    },300); 
 
}

.container { 
 
    background-color: gray; 
 
    width: 500px; 
 
    height: 500px; 
 
}

<div class="container" onmousedown="updateLocation(event)">Test Div</div>