如何使用 Javascript 在浏览器中通过 X-Y 坐标定位？

Posted 2023-02-22

技术标签:

【中文标题】如何使用 Javascript 在浏览器中通过 X-Y 坐标定位？【英文标题】：How do I use Javascript to locate by X-Y Coordinates in my browser? 【发布时间】：2010-09-09 05:19:46 【问题描述】：

我正在努力做到这一点，当用户向下滚动页面，单击链接，做他们需要做的任何事情，然后返回到带有链接的页面时，它们是相同的（xy ) 之前在浏览器中的位置。我该怎么做？

我是 DOM 新手，所以我不太了解如何执行此操作。

目标浏览器：IE6/7/8、Firefox 2/3、Opera、Safari

补充：我正在使用一个名为 JQuery 的程序来帮助我学习

【问题讨论】：

【参考方案1】：

要获取用户点击页面的 x-y 位置，请使用以下 jQuery 代码：

<html>
    <head>
        <script type="text/javascript" src="jquery.js"></script>
        <script type="text/javascript">
            jQuery(document).ready(function()
                $("#special").click(function(e)
                    $('#status2').html(e.pageX +', '+ e.pageY);
                ); 
            );
        </script>
    </head>
    <body>
        <h2 id="status2">
            0, 0
        </h2>
        <div style="width: 100px; height: 100px; background:#ccc;" id="special">
            Click me anywhere!
        </div>
    </body>
</html>

【讨论】：

【参考方案2】：

通常，如果您离开然后返回，浏览器会保留页面视口（在您最喜欢的新闻网站上的任何页面上尝试）。唯一的例外可能是您调整缓存设置以每次重新下载并重新呈现页面。

不这样做（即不将页面设置为从不缓存）可能是解决问题的最简单、最不突兀的方法。

【讨论】：

【参考方案3】：

据我所知，获取视口位置的代码在浏览器之间有所不同，因此使用某种框架会更容易，例如，Prototype 有一个函数 document.viewport.getScrollOffsets（我相信，是你所追求的人）。

但是，获取坐标只是其中的一部分，另一部分将在稍后对它们进行处理。在这种情况下，您可以将事件侦听器添加到 window.unload 事件，当该事件触发时，将位置保存在 cookie 中，然后当用户再次打开页面时，检查该 cookie 是否存在并相应地滚动。

尽管如果您关心的只是让用户通过浏览器的“后退”按钮回到他访问页面时的位置，那么大多数浏览器不是已经自动完成了吗？

【讨论】：

【参考方案4】：

试试this 或this。