现在，在我们的最后一部分中，我们将通过建立事件处理程序，而不是在点击按钮时机器人做出响应，我们的机器人将在屏幕上跟随着鼠标而移动。在这个过程中，我们将讨论跨浏览器的代码，并且触摸屏也可用

假如你看一下我们上一次的代码，你可以看到，尽管我们的代码运行得很好（并且同时有多个机器人）,然而这里没有一个简单的方式来运行代码。

事件处理程序是这样的命令，当特定的事件触发时，它告诉某些代码运行。例如，任何时候，你可以让一个用户点击有“my_div' id的‘div’时，'my_function()'执行。或者，当用户在‘my_other_div'上移动鼠标时，'my_other_function()'执行

理论上，这个一个相当简单且直观的主意。不幸的是，当你卷入 不同的浏览器，这将会有一点迷惑。理想情况下，每个浏览器都会以同样的方式在解释代码，而开发者将只写需要写一次代码就可以让每个用户看到相同的结果。在真实世界中，不同的浏览器可能会有完全不同的命名来做同一件事（*咳**咳* IE），所以有时候想要一段代码在所有的浏览器中都运行得一样，会让人觉得像是在放牧一群猫。最近，情况已经变得很好了，Chrome,Firefox, Safgari,Opera对代码的响应已经非常相似了，IE9和IE10已经变得比早期的版本更加符合标准。并且几乎没有人在使用IE7和IE6了。因此，我们代码将使得事件处理程序在现代浏览器和IE8种可工作

作为一方面的说明，这是一种使用一个强大JavaScript库的原因，比如jQuery。jQuery已经为你做好了所有的跨浏览器测试，因此，你只需要输入一个命令，jQuery会在幕后翻译它使得它在每个浏览器中都可用。此外，许多jQuery命令都比核心JavaScript更加直观、简单。

但是，由于我的固执，并且这是一次学习的机会，我们将继续在这条艰难的路上努力，只用JavaScript来做这一切，不依赖任何库

我们第一步要决定到底将怎么和页面交互。当我在舞台区域移动鼠标时，我想要所有的机器人朝着鼠标移动的方向跑。当它们抵达鼠标或者鼠标正好在它们上面，我想要它们停止移动。假如鼠标放在它们身上，我想要它们跳起来。最后，当鼠标离开舞台，我想要它们停止跑动。我们将从绑定事件到RobotMaker函数内部开始。

stage.addEventListener('mousemove', stage_mousemove_listener, false);
robot.addEventListener('mouseover', robot_mouseover_listener, false);
stage.addEventListener('mouseout', stage_mouseout_listener, false);

因此，在上面的几行代码中，我们说过，无论什么时候用户在舞台(stage)元素上移动鼠标，将触发一个叫做stage_mousemove_listener()的函数（注意，在命令中，我们并没有包含参数）。相似地，当用户在robot元素上移动鼠标，将触发robot_mouseover_listener()，当用户从舞台上移开鼠标，触发stage_mouseout_listenr()

不幸的是，之前我们提到过，IE8及其低版本使用不同（但是相似）的命令来做相同的事，因此，我们需要进行测试，以便知道用户的浏览器将会理解哪条命令，并执行相应的方法。

if (stage.addEventListener){ // We will test to see if this command is available
  stage.addEventListener('mousemove', stage_mousemove_listener, false);
  robot.addEventListener('mouseover', robot_mouseover_listener, false);
  stage.addEventListener('mouseout', stage_mouseout_listener, false);
} else { // If not, we have to use IE commands
  stage.attachEvent('onmousemove', stage_mousemove_listener);
  robot.attachEvent('onmouseover', robot_mouseover_listener);
  stage.attachEvent('onmouseout', stage_mouseout_listener); 
}

你可能会注意到那些命令的格式非常相似，但是还是有一些主要的区别：一个叫做‘addEventListener'，一个叫做'attachEvent'，一个叫做'mousemove'，然而另一个叫做'onmousemove'。一个需要第三个参数，而另个只用了两个。混淆它们之间的任何一个都会导致命令不执行。这一系列的事会使你有用脑袋撞墙的冲动。不幸的是，为了是具有跨浏览器的能力，这并不是我们需要额外编写的最后代码