Javascript 为什么不'；t鼠标事件工作正常
这是一段很重要的代码，但如果你允许我：Javascript 为什么不'；t鼠标事件工作正常,javascript,mouseevent,css-position,Javascript,Mouseevent,Css Position,这是一段很重要的代码，但如果你允许我： <html> <head> <style> .mobile {position: absolute;} </style> <script> var images = new Array(); image['Key1']='image1.png'; image['Key2']='image2.png'; imag
<html>
<head>
<style>
.mobile {position: absolute;}
</style>
<script>
var images = new Array();
image['Key1']='image1.png';
image['Key2']='image2.png';
image['Key3']='image3.png';
image['Key4']='image4.png';
image['Key5']='image5.png';
function createAll()
{
tag = document.getElementById("canvas");
for(var key in image)
{
var r = key;
while(r.indexOf('_')>-1)
{
r=r.replace('_',' ');
}
let t = document.createElement("p");
t.id=r;
t.className="mobile"
t.xVel = Math.floor(Math.random()*50-25);
t.yVel = Math.floor(Math.random()*50-25);
t.xPos = Math.floor(Math.random()*1000)-60;
t.style.left= t.xPos;
t.onclick="clickTag('"+r+"')";
t.yPos=Math.floor(Math.random()*600)-42;
////THIS IS WHERE THE EVENT IS ADDED////
t.addEventListener("onmousedown", function(){clickTag(t);});
////THIS IS WHERE THE EVENT IS ADDED////
t.style.top=t.yPos;
var i = document.createElement("img");
i.src=image[key];
var s = document.createElement("span");
tag.appendChild(t);
t.appendChild(i);
t.appendChild(s);
setTimeout(function() {step(t);},200);
}
}
function restartMe(tag)
{
var x = Math.floor(Math.random()*1000);
var y = Math.floor(Math.random()*600);
var xVel = Math.floor(Math.random()*50-25);
var yVel = Math.floor(Math.random()*50-25);
var r = Math.random();
if(r<.25)//left wall
{
x=-59;
xVel = Math.floor(Math.random()*10);
}
else if(r<.5)//right wall
{
x=1059;
xVel = -Math.floor(Math.random()*10);
}
else if(r<.75)//top wall
{
y=-41;
yVel = Math.floor(Math.random()*10);
}
else//bottom wall
{
y=641;
yVel = -Math.floor(Math.random()*10);
}
tag.xPos = x;
tag.style.left=x;
tag.yPos = y;
tag.style.top=y;
tag.style.xVel=xVel;
tag.style.yVel=yVel;
let t = tag;
setTimeout(function() {step(t);},200);
}
function step(tag)
{
var x = tag.xPos;
var y = tag.yPos;
var dx = tag.xVel;
var dy = tag.yVel;
x+=dx;
y+=dy;
let t = tag;
if(x<-60 || x>1060 || y<-42 || y>642)
{
x=-500;
y=-500;
tag.xPos=x;
tag.yPos=y;
tag.style.left=x;
tag.style.top=y;
setTimeout(function() {restartMe(t);},1000);
return;
}
tag.xPos=x;
tag.yPos=y;
tag.style.left=x;
tag.style.top=y;
setTimeout(function() {step(t);},200);
}
function startGame()
{
var tag = document.getElementById("game");
target = Object.keys(image)[Math.floor(Math.random()*Object.keys(image).length)];
var r = target;
while(r.indexOf('_')>-1)
{
r=r.replace('_',' ');
}
target=r;
tag.innerHTML="Look for the "+target;
}
function clickTag(id)
{
////HERE IS WHERE THE MOUSE EVENT SHOULD EXECUTE////
if(id===target)
{
startGame();
}
var tag = document.getElementById("output");
tag.innerHTML="No, that is the "+id;
}
</script>
</head>
<body onload="createAll();startGame()">
<h2>What do you see?</h2>
<p id="game"></p>
<p id="output"></p>
<p id="canvas" class="black" width="1000" height="600"></p>
</body>
</html>
.mobile{位置：绝对；}
var images=新数组（）；
图像['Key1']='image1.png'；
图像['Key2']='image2.png'；
图像['Key3']='image3.png'；
图像['Key4']='image4.png'；
图像['Key5']='image5.png'；
函数createAll（）
{
tag=document.getElementById（“画布”）；
for（图像中的var键）
{
var r=键；
while（r.indexOf（“”“）>-1）
{
r=r。替换（“”，“”）；
}
设t=document.createElement（“p”）；
t、 id=r；
t、 className=“移动”
t、 xVel=Math.floor（Math.random（）*50-25）；
t、 yVel=Math.floor（Math.random（）*50-25）；
t、 xPos=Math.floor（Math.random（）*1000）-60；
t、 style.left=t.xPos；
t、 onclick=“clickTag（“+r+”）”；
t、 yPos=Math.floor（Math.random（）*600）-42；
////这是添加事件的位置////
t、 addEventListener（“onmousedown”，function（）{clickTag（t）；}）；
////这是添加事件的位置////
t、 style.top=t.yPos；
var i=document.createElement（“img”）；
i、 src=图像[键]；
var s=document.createElement（“span”）；
附加子项（t）；
t、 儿童（一）；
t、 儿童；
setTimeout（函数（）{step（t）；}，200）；
}
}
函数重新启动时间（标记）
{
var x=Math.floor（Math.random（）*1000）；
变量y=数学地板（数学随机（）*600）；
var xVel=Math.floor（Math.random（）*50-25）；
var yVel=数学地板（数学随机（）*50-25）；
var r=Math.random（）；
如果（rFirst addEventListener在字符串中不使用“on”
t.addEventListener("mousedown", ...
现在，您正确地添加了所有其他事件，并且使用超时调用了闭包，但是您构建的click事件是错误的
t.onclick="clickTag('"+r+"')";
即将字符串分配给事件侦听器，而不是绑定函数调用
t.onclick= function () { clickTag(r); };
First addEventListener在字符串中不使用“on”
t.addEventListener("mousedown", ...
现在，您正确地添加了所有其他事件，并且使用超时调用了闭包，但是您构建的click事件是错误的
t.onclick="clickTag('"+r+"')";
即将字符串分配给事件侦听器，而不是绑定函数调用
t.onclick= function () { clickTag(r); };
在您的示例中只有一个createAll
实例，但它显示为函数声明，因此您从未实际执行createAll（）
，因此它没有启用事件侦听器
尝试将createOne（）
更改为createAll（）
在您的示例中只有一个createAll
实例，但它显示为函数声明，因此您从未实际执行createAll（）
，因此它没有启用事件侦听器
尝试将createOne（）
更改为createAll（）
因为addEventListener在事件名称中不使用“开”因为addEventListener在事件名称中不使用“开”谢谢。那是一个拼写错误。我现在已经解决了。谢谢。那是一个拼写错误。我现在已经解决了。啊。是的。解决了。谢谢。是的。解决了。谢谢。是的。解决了。谢谢