<!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> <style> #div1{ height:100px; 100px; background:red; position:absolute; } </style> <script> window.onload = function () { var odiv = document.getElementById('div1'); var key = { l:null,t:null,r:null,b:null}; setInterval(function () { if(key.l) odiv.style.left = odiv.offsetLeft + - 10 + 'px'; if(key.t) odiv.style.top = odiv.offsetTop - 10 + 'px'; if(key.r) odiv.style.left = odiv.offsetLeft + 10 + 'px'; if(key.b) odiv.style.top = odiv.offsetTop + 10 + 'px'; },50) document.onkeydown = function (ev) { var ev = ev || event; switch(ev.keyCode) { case 37 : key.l = true; break; case 38 : key.t = true; break; case 39 : key.r = true; break; case 40 : key.b = true; break; } } document.onkeyup = function (ev) { var ev = ev || event; switch(ev.keyCode) { case 37 : key.l = false; break; case 38 : key.t = false; break; case 39 : key.r = false; break; case 40 : key.b = false; break; } } } </script> </head> <body> <div id="div1"></div> </body> </html>