Javascript mouseX和mouseY仅检测对角线坐标_Javascript

Javascript mouseX和mouseY仅检测对角线坐标

javascript

Javascript mouseX和mouseY仅检测对角线坐标,javascript,Javascript,我把输入框的位置与mouseX和mouseY坐标系在一起，但我的问题是，当我单击时，我只能单击身体上的一个小对角线区域。我想要它，这样我就可以点击身体上的任何地方，它就会到达那个位置。关于如何解决这个特殊问题有什么想法吗 <body onclick = "getLocation(event)"> <style> html{ } div{ display: block; } textarea, input { clear: both; p

我把输入框的位置与mouseX和mouseY坐标系在一起，但我的问题是，当我单击时，我只能单击身体上的一个小对角线区域。我想要它，这样我就可以点击身体上的任何地方，它就会到达那个位置。关于如何解决这个特殊问题有什么想法吗

<body onclick = "getLocation(event)">
    <style>

html{
}
div{
    display: block;
}


 textarea, input {
      clear: both;
position: relative;
}
textarea, input {
overflow: auto;
width: 20%;
}
</style>

<input id = "enter" placeholder = "input" style = "top:20;left:40;"></input>
</body>
<script>
function getLocation(event){
var y = event.clientY;
var x = event.clientY;
console.log("Y:" + y + " X:" + x);
document.getElementById("enter").style.left = x;
document.getElementById("enter").style.top = y;
}
</script>

您需要设置身体的宽度和高度。您还需要在位置上设置单位，您很可能希望使用pageX和pageY，而不是clientX和clientY

函数getLocationevent{ var y=event.pageY； var x=event.pageX； console.logY:+y+X:+X； document.getElementByIdentiter.style.left=x+px； document.getElementByIdentiter.style.top=y+px； } document.body.addEventListenerclick，获取位置； html，正文{ 宽度：100%；身高：100%； } div{ 显示：块； } 文本区，输入{ 明确：两者皆有；位置：相对位置； } 文本区，输入{ 溢出：自动；宽度：20%； } 只要更换这个，它就会工作：

<script>

function getLocation(event){

  document.getElementById('enter').style.left  = (window.Event) ? event.pageX : event.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft);
  document.getElementById('enter').style.top = (window.Event) ? event.pageY : event.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop);

}
</script>