遇到的问题： Question①：mousemove事件中，移动方法中会被记录很多的left和top，我只需要大概的几组数据就行，不需要那么多； Question②：回放的时候，在for循环里执行太快了，导致的效果就是直接看到开始跟结束位置，我想放慢中间的过程；搞了一个延迟的函数，但是还是没有实质性解决。 慢慢慢慢拖动小方块到一个新位置，然后松开鼠标， 先点击“复位”，再点击“回放”查看所经过的路径， 只有一次机会哦 - -||| 循环内延迟的部分代码： 复制代码 代码如下: //延迟方法 sleep: function(n) { var start = new Date().getTime(); while (true) if (new Date().getTime() - start > n) break; }, //回看轨迹记录 backTrack: function() { var oSlippage = document.getElementById("slippage"); var len = this.X.length; for (var i = 0; i < len; i++) { oSlippage.style.left = this.X[i] - this.relativeX; oSlippage.style.top = this.Y[i] - this.relativeY; //延迟循环方法 this.sleep(10); } } 还是没有达到慢慢回放的效果，待解决。。。 啊哈，今早解决了~！ 不用for循环，通过定时器运用数组的下标来不断改变小方块的left和top 定时器结合数组下标 复制代码 代码如下: //延迟方法 sleep: function(n) { //var start = new Date().getTime(); //while (true) // if (new Date().getTime() - start > n) // break; var oSlippage = document.getElementById("slippage"); oSlippage.style.left = this.X[this.iNum] - this.relativeX; //iNum为数组下标 oSlippage.style.top = this.Y[this.iNum] - this.relativeY; MOUSETRACKRECORD.iNum++; //如果下标大于了他的长度就停止回放 if (this.iNum > this.X.length - 1) { clearInterval(this.timeID); } }, //回看轨迹记录 backTrack: function() { //var oSlippage = document.getElementById("slippage"); //var len = this.X.length; //for (var i = 0; i < len; i++) { // oSlippage.style.left = this.X[i] - this.relativeX; // oSlippage.style.top = this.Y[i] - this.relativeY; // //延迟循环方法 // this.sleep(10); //} this.timeID = setInterval("MOUSETRACKRECORD.sleep()", 10); } 演示效果： [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

　　推荐阅读

　　jquery获取input表单值的代码

jquery取radio单选按钮的值$("input[name='items']:checked").val();jquery radio取值，checkbox取值，select取值，radio选中，checkbox选中，select选中，及其相关 获取一组radio被选中项的值 var item = $('inpu>>>详细阅读

本文标题：记录鼠标的轨迹并回放的js代码

地址：http://www.17bianji.com/kaifa2/JS/26584.html

 1/2    1