javascript的onmousemove/event.clientX正在运行,但会抛出错误

Question

javascript的onmousemove/event.clientX正在运行,但会抛出错误

jan*_*gxx 1 html javascript google-chrome mousemove

当我意识到它在Chrome控制台中引发数以千计的错误时,我只是将这个小鼠标跟踪示例放在一起.

Uncaught TypeError: Cannot read property 'clientX' of undefined

Run Code Online (Sandbox Code Playgroud)

AFAIK这意味着,chrome无法找到此属性所属的对象.但是,如果我打开这个例子,它会很好地显示正确的坐标.请帮我摆脱这些无用的错误.

<html>
<head>
    <style type="text/css">
        #tracking {
            width: 300px;
            height: 300px;
            background-size: 300px 300px;
            background-color: #00F;
            left: 100px;
            top: 100px;
            position: absolute;
        }
    </style>
    <script type="text/javascript">
        var mX, mY;
        var track;
        document.onmousemove = update;

        function trackload()
        {
            track = document.getElementById("tracking");
            setTimeout("update()",10);
        }

        function update(e)
        {
            mX = e.clientX;
            mY = e.clientY;
            if (track) {
                track.innerHTML = "X: " + mX + " Y: " + mY + " deg: " + (Math.atan(mY / mX) * (180/Math.PI));
                track.style.cssText = "-webkit-transform: rotate(" + (Math.atan(mY / mX) * (180/Math.PI)) + "deg);";}
            setTimeout("update()",10);
        }
    </script>
</head>
<body>
    <div id="tracking" onclick="trackload()"></div>
</body>

Run Code Online (Sandbox Code Playgroud)

Answer 1

Jam*_*ice 5

删除调用以setTimeout防止错误.之所以会发生这种情况,是因为update函数需要一个事件对象,当你通过函数调用函数时它不会传入setTimeout.因此e未定义,您得到错误.

这是一个有效的例子.

如果电话有充分的理由setTimeout,你需要解释它,因为我无法弄清楚为什么乍一看它们是必要的.作为旁注,传递字符串setTimeout通常被认为是不好的做法(它是别名eval).您只需传递对该函数的引用即可.

归档时间：	13 年，9 月前
查看次数：	3712 次
最近记录：	8 年，10 月前