如果让下面的代码兼容谷歌和firefox浏览器，解决立即给分！


<HTML> <HEAD>
<TITLE>录制鼠标轨迹</TITLE>
<meta charset="UTF-8" />

<link rel="stylesheet" href="test.css" type="text/css">
</HEAD> <BODY onmousemove=follow()>
<div id="arrow" style="position:absolute; width:12px; height:21px; z-index:1;visibility:hidden">
<img src="http://www.codefans.net/jscss/demoimg/201302/cursor.gif">
</div>
<div id="mousefollow" style="position:absolute; width:12px; height:21px; z-index:1;visibility:hidden">.</div>
<input type="text" value=100 id="maxnum" name="maxnum" size="4" maxlength="4">
<input type=button onclick=startthis() value=录制>
<input type=button onclick=stopthis() value=停止>
<input type=button onclick="speed=50;playthis()" value=播放>
<input type=button onclick="speed=2;playthis()" value=快放>
<input type=button onclick="speed=150;playthis()" value=慢放>
<input type=button onclick="speed=50;rewindthis()" value=倒放>
<input type="button" id="textfield" name="textfield" style="width:100px" value="无时间限制"><script language="JavaScript">
 <!--
 //var mousefollow=document.getElementById("mousefollow");
 //var maxnum=document.getElementById("maxnum");
 //var arrow=document.getElementById("arrow");
 //alert(arrow);
var mousex = new Array();
var mousey = new Array();
var i;
var j = 0;
var k;
var recordcount = 0;
var repeat;
var repeat2;
var repeat3;
var speed = 50;
var textfield=document.getElementById("textfield"); function startthis() {
recordcount = 1;
i = 0;
mousex = new Array();
mousey = new Array();
recordthis();
} function recordthis() {
var e = e || window.event;
if (maxnum.value == '' || isNaN(maxnum.value) == true || maxnum.value < 0) {
if (recordcount == 1) {
mousex[i] = mousefollow.offsetLeft;
document.write(mousex[i]);
mousey[i] = mousefollow.offsetTop;
i++;
k = i;
//alert(k);
textfield.value = '无时间限制';
}
} else {
if (recordcount == 1) {
if (i < maxnum.value) {
mousex[i] = mousefollow.offsetLeft;
mousey[i] = mousefollow.offsetTop;
i++;
k = i;
textfield.value = '剩余' + (maxnum.value - i) + '/50秒';
} else {
recordcount = 0;
textfield.value = '时间到';
}
}
}
repeat = setTimeout("recordthis()", 20);
} function stopthis() {
clearTimeout("repeat");
recordcount = 0;
} function playthis() {
clearTimeout("repeat");
clearTimeout("repeat3");
recordcount = 0;
if (j < i - 1) {
arrow.style.pixelLeft = mousex[j];
arrow.style.pixelTop = mousey[j];
arrow.style.visibility = 'visible';
j++;
repeat2 = setTimeout("playthis()", speed);
} else {
clearTimeout("repeat2");
arrow.style.visibility = 'hidden';
j = 0;
}
} function rewindthis() {
clearTimeout("repeat");
clearTimeout("repeat2");
recordcount = 0;
if (k > 0) {
arrow.style.pixelLeft = mousex[k - 1];
arrow.style.pixelTop = mousey[k - 1];
arrow.style.visibility = 'visible';
k--;
repeat3 = setTimeout("rewindthis()", speed);
} else {
clearTimeout("repeat3");
arrow.style.visibility = 'hidden';
k = i;
}
} function follow() {
var e = e || window.event;
mousefollow.style.pixelLeft = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
mousefollow.style.pixelTop = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
}
// -->
</script>
</BODY>
</HTML>js放到页面后端或是用window.onload，加载网页完毕再执行.
之前的textfield没有定义

解决方案 »

  1.   

    测试过放到后端，对于谷歌和firefox浏览器也是不行的。
      

  2.   

    播放的时候，在谷歌和firefox浏览器没反应。
      

  3.   

    chrome和firfox是不能直接用标签的name做变量的，要用document.getElementByName获取用jquery库就没那么麻烦了我试着帮你改了改，但不知道你这个是做什么用的，还有几个地方还没改过来，你自己看看，用jquery了
    http://www.htmljscss.com/editor/7F3Z9W.html
      

  4.   

    非常感谢。
    不过您确定在chrome浏览器测试过吗？测了还是不好使啊。
    另外能否不用jquery实现？
      

  5.   

    貌似兼容性还有style.pixelLeft，style.pixelTop 在chrome和firefox的问题，所以总不好使。
      

  6.   

    自己解决啦：
    <HTML>
         <HEAD>
            <TITLE>录制鼠标轨迹</TITLE>
             
            <link rel="stylesheet" href="test.css" type="text/css">
        </HEAD>
        <BODY onmousemove=follow()>
            <div id="arrow" style="position:absolute; width:12px; height:21px; z-index:1;visibility:hidden">
                <img src="http://www.codefans.net/jscss/demoimg/201302/cursor.gif">
            </div>
            <div id="mousefollow" style="position:absolute; width:12px; height:21px; z-index:1;visibility:hidden">.</div>
            <input type="text" value=100 id="maxnum" name="maxnum" size="4" maxlength="4">
            <input type=button onclick=startthis() value=录制>
            <input type=button onclick=stopthis() value=停止>
            <input type=button onclick="speed=50;playthis()" value=播放>
            <input type=button onclick="speed=2;playthis()" value=快放>
            <input type=button onclick="speed=150;playthis()" value=慢放>
            <input type=button onclick="speed=50;rewindthis()" value=倒放>
            <input type="button" id="textfield" name="textfield" style="width:100px" value="无时间限制">
     <div id=ttt style="width:1024px;height:1024px;background-color:#ffffff;"></div>       
    <script language="JavaScript">
                 <!--
                 //var mousefollow=document.getElementById("mousefollow");
                 //var maxnum=document.getElementById("maxnum");
                 //var arrow=document.getElementById("arrow");
                 //alert(arrow);
                var mousex = new Array();
                var mousey = new Array();
                var i;
                var j = 0;
                var k;
                var recordcount = 0;
                var repeat;
                var repeat2;
                var repeat3;
                var speed = 50;
                var textfield=document.getElementById("textfield");
     
                function startthis() {
                    recordcount = 1;
                    i = 0;
                    mousex = new Array();
                    mousey = new Array();
                    recordthis();
                }
     
                function recordthis() {
                    var e = e || window.event;
                    if (maxnum.value == '' || isNaN(maxnum.value) == true || maxnum.value < 0) {
                        if (recordcount == 1) {
                            mousex[i] = mousefollow.offsetLeft;                        mousey[i] = mousefollow.offsetTop;
                            i++;
                            k = i;
                            //alert(k);
                            textfield.value = '无时间限制';
                        }
                    } else {
                        if (recordcount == 1) {
                            if (i < maxnum.value) {
                                mousex[i] = mousefollow.offsetLeft;
                                mousey[i] = mousefollow.offsetTop;
                                i++;
                                k = i;
                                textfield.value = '剩余' + (maxnum.value - i) + '/50秒';
                            } else {
                                recordcount = 0;
                                textfield.value = '时间到';
                            }
                        }
                    }
                    repeat = setTimeout("recordthis()", 20);
                }
     
                function stopthis() {
                    clearTimeout("repeat");
                    recordcount = 0;
                }
     
                function playthis() {
                    clearTimeout("repeat");
                    clearTimeout("repeat3");
                    recordcount = 0;
                    if (j < i - 1) {
                        arrow.style.left = mousex[j];    
                     // alert(arrow.style.Left);
                        arrow.style.top = mousey[j];
                        arrow.style.visibility = 'visible';
                        j++;
                     
                        repeat2 = setTimeout("playthis()", speed);
                    } else {
                        clearTimeout("repeat2");
                        arrow.style.visibility = 'hidden';
                        j = 0;
                    }
               
                }
     
                function rewindthis() {
                    clearTimeout("repeat");
                    clearTimeout("repeat2");
                    recordcount = 0;
                    if (k > 0) {
                        arrow.style.left = mousex[k - 1];
                        arrow.style.top = mousey[k - 1];
                        arrow.style.visibility = 'visible';
                        k--;
                        repeat3 = setTimeout("rewindthis()", speed);
                    } else {
                        clearTimeout("repeat3");
                        arrow.style.visibility = 'hidden';
                        k = i;
                    }
                }
     
                function follow() {
                        var e = e || window.event;
                        mousefollow.style.left = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
                      document.getElementById('ttt').innerHTML=  mousefollow.style.left;
                        mousefollow.style.top = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
                    }
                    // -->
            </script>
        </BODY>
    </HTML>