クリックイベントは、ページ全体を実装することになっていたに次のコードを実行しますが、身体のホールドアップは、コンテンツに依存するので、ブラックボックスの部分だけ実際にのみ、イベントをクリックします。
<!DOCTYPE html>
<html>
<head>
<title>学习事件</title>
<style type="text/css">
body{
border: 1px solid black;
}
</style>
<script type="text/javascript">
window.onload = function(){
document.body.onclick = function(){
alert("something");
}
};
</script>
</head>
<body>
<input type="button" value="点击">
</body>
</html>
あなたはページ全体のクリックイベントを実装する場合は、その後、体を取り除く直接document.onclick、あなたがクリックどんなには、クリックイベントが触れます
<!DOCTYPE html>
<html>
<head>
<title>学习事件</title>
<style type="text/css">
body{
border: 1px solid black;
}
</style>
<script type="text/javascript">
window.onload = function(){
document.onclick = function(){
alert("something");
}
};
</script>
</head>
<body>
<input type="button" value="点击">
</body>
</html>注：ボタンがない実用的な効果を、単なる気晴らし本体に導入
マウス位置のクリックは非常に簡単で、event.clientXとevent.clientYを追加ここで取得します。
<!DOCTYPE html>
<html>
<head>
<title>学习事件</title>
<style type="text/css">
body{
border: 1px solid black;
}
</style>
<script type="text/javascript">
window.onload = function(){
document.onclick = function(){
alert("("+event.clientX+","+event.clientY+")");
}
};
</script>
</head>
<body>
<input type="button" value="点击">
</body>
</html>最後に、機能のonclickイベントパラメータを渡すことができ、次の互換性を考慮してください
<!DOCTYPE html>
<html>
<head>
<title>学习事件</title>
<style type="text/css">
body{
border: 1px solid black;
}
</style>
<script type="text/javascript">
window.onload = function(){
document.onclick = function(ev){
var oEvent = ev || event;//考虑了兼容性
alert("("+oEvent.clientX+","+oEvent.clientY+")");
}
};
</script>
</head>
<body>
<input type="button" value="点击">
</body>
</html>
