Question

我正在开发一个javascript学习项目（没有jQuery），我需要测试鼠标的水平位置是否与变量相同。

我有一个跟随鼠标的div，当它的水平位置等于另一个div的水平位置时，我想做点什么。

这就是我所拥有的：

    var x = e.clientX; 

    var otherVar = 200;

    document.getElementById('testDiv').style.left = otherVar + "px";

    if (x == otherVar) {

        //do stuff

    } else {

        //do other stuff

    }

我已经测试了它并且似乎没有用，但是控制台上没有出现错误。

感谢您的帮助。

Answer 1

document.getElementById需要一个字符串，您需要监听mousemove事件：

这应该有助于指明你正确的方向。祝你好运。

＆＃13;

//define your vars:
var otherDiv = document.getElementById("otherDiv"),
    testDiv = document.getElementById("testDiv"),
    otherVar = otherDiv.offsetLeft; //otherDiv's left position in px
//add event listener:
document.addEventListener("mousemove", onmousemove);
//handle the event:
function onmousemove(e) {
  var x = e.clientX; //get the current x position
  testDiv.style.left = x + "px"; //move testDiv
  if (x >= otherVar) {
    //do stuff
    testDiv.style.backgroundColor = "green";
  } else {
    //do other stuff
    testDiv.style.backgroundColor = "red";
  }
};

＆＃13;

body {
  margin:0;
  background: #eee;
}
#otherDiv {
  position: relative;
  margin-left: 30%;
  width: 70%;
  height: 20px;
  background-color: blue;
}
#testDiv {
  position: absolute;
  left: 0;
  top: 20px;
  width: 100px;
  height: 100px;
  background-color: red;
}

＆＃13;

<div id="otherDiv">otherDiv</div>
<div id="testDiv">testDiv</div>

＆＃13;

如何测试水平鼠标位置是否等于Javascript中的变量

1 个答案: