首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

在Javascript window.open()中保持滚动位置

在Javascript中,window.open()方法用于打开一个新的浏览器窗口。然而,它不能直接保持滚动位置。要在window.open()中保持滚动位置,您需要在打开新窗口时将滚动位置作为参数传递。

以下是一个示例代码,展示了如何在打开新窗口时保持滚动位置:

代码语言:javascript
复制
function openWindowWithScrollPosition() {
  const scrollX = window.scrollX;
  const scrollY = window.scrollY;

  const newWindow = window.open('https://www.example.com', '_blank');

  newWindow.onload = function() {
    newWindow.scrollTo(scrollX, scrollY);
  };
}

在这个示例中,我们首先获取当前窗口的滚动位置(scrollXscrollY),然后使用window.open()打开一个新的窗口。接着,我们在新窗口加载完成后,使用newWindow.scrollTo(scrollX, scrollY)将滚动位置设置为与原始窗口相同的位置。

需要注意的是,由于浏览器的安全策略,有时在新窗口中设置滚动位置可能会受到限制。在这种情况下,您可能需要考虑使用其他方法来实现类似的功能,例如在新窗口中使用锚点或者通过其他方式传递滚动位置。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

JavaScript中window.open()和Window Location href的区别

支持下面的值: true - URL 替换浏览历史中的当前条目。 false - URL 在浏览历史中创建新的条目。...只要有窗口的名称和window.open中第二个参数中的一样就会将这个窗口替换,用这个特性的话可以在iframe和frame中来代替location.href。...:在框架内指定页面打开连接 window.location或window.open如何指定target?...","_top"); 5:是否打开其他网站地址 window.open()是可以在一个网站上打开另外的一个网站的地址 而window.location()是只能在一个网站中打开本网站的网页 window.open...我们来定制这个弹出的窗口的外观,尺寸大小,弹出的位置以适应该页面的具体情况。   javascript">   <!

2.3K51
  • React中将一直增加消息的滚动框保持在当前浏览的位置

    通常需要一个滚动框来展示所有消息,且每次的新消息都会展示在滚框的顶部,但同时这个消息滚动框还是可以拖动鼠标浏览的。...解决思路如下:在新消息来了更新页面前,获取当前页面的高度A,更新完成后,用新的页面高度B减去之前的页面高度A得出值C,C的值即为滚动条因为新增了消息自动滚动了多少,然后在更新完成后的页面上获取scrollTop...此时新消息来了,就可以保证我们当前浏览的消息相对整个滚动框仍然保持以前的位置。 其实很简单,但是讲起来有点绕,不知道我有没有说清楚,没有听明白的放学别走来找我。  以下是代码实现,方便大家抄作业。...// 卸载时清除定时器 componentWillUnmount() { window.clearInterval(this.interval); } // 更新前获取当前的滚动高度...getSnapshotBeforeUpdate() { return this.rootNode.scrollHeight; } // 将滚动的高度重新计算赋值 componentDidUpdate

    78540

    JavaScript中window.open()和Window Location href的区别「建议收藏」

    支持下面的值: true – URL 替换浏览历史中的当前条目。 false – URL 在浏览历史中创建新的条目。 _blank – URL加载到一个新的窗口。...支持下面的值: true – URL 替换浏览历史中的当前条目。 false – URL 在浏览历史中创建新的条目。...只要有窗口的名称和window.open中第二个参数中的一样就会将这个窗口替换,用这个特性的话可以在iframe和frame中来代替location.href。...你的网址”,”_top”); 5:是否打开其他网站地址 window.open()是可以在一个网站上打开另外的一个网站的地址 而window.location()是只能在一个网站中打开本网站的网页...我们来定制这个弹出的窗口的外观,尺寸大小,弹出的位置以适应该页面的具体情况。   javascript”>   <!

    5.6K20

    细胞身份何以在分裂中得以保持?

    由于染色体上有遗传物质DNA,因而在细胞的亲代和子代之间保持了遗传性状的稳定性。可见,细胞的有丝分裂对于生物的遗传有重要意义。 ? 大家体会到这种重要意义了吗? 但是,细胞身份何以在分裂中得以保持?...所以如果只是传递DNA,不足以保持其亲代的特点。因为细胞类型之间的区别不在于DNA。 那么,在DNA不变的情况下传递遗传性状的行为,我们叫做表观遗传。...所以,细胞身份在分裂中得以保持至少有表观遗传的结果。 ? 在解释细胞身份稳定性之前,我们需要声明一点,不是因为分裂了才需要保持细胞身份。...这样在高中生物中,我们知道有丝分裂时候,染色质是平均分配的。这样就保持了稳定性。注意,细胞分裂的时候,细胞质并不是平均分配的。...在癌症的发生和发展过程中,全基因组和基因特异性的DNA甲基化变化是由于染色质调节剂突变或解除管制而发生的。在转化过程中发生的早期异常的DNA甲基化状态在肿瘤进化过程中被保留。

    1K30

    javascript中各种计算位置高度的方法

    屏幕可用工作区高度: window.screen.availHeight; 屏幕可用工作区宽度:window.screen.availWidth; scrollHeight: 获取对象的滚动高度...offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度 offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置...offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置 event.clientX 相对文档的水平座标 event.clientY 相对文档的垂直座标...event.offsetX 相对容器的水平坐标 event.offsetY 相对容器的垂直坐标 document.documentElement.scrollTop 垂直方向滚动的值...event.clientX+document.documentElement.scrollTop 相对文档的水平座标+垂直方向滚动的量 要获取当前页面的滚动条纵坐标位置,用: document.documentElement.scrollTop

    1.6K20

    JavaScript 获取鼠标及元素在页面上的位置

    HTML5学堂:JavaScript获取鼠标的位置,大家会想到clientX/Y等属性,灵活的获取鼠标的位置信息,能够便于我们实现各种复杂的页面交互效果,到底还有哪些属性可以获取鼠标的位置信息?...另外,还有哪些能快速获取标签在页面中的位置信息? 在书写一些“拖拽”页面交互效果,比如常见的拖拽效果、自定滚动条、放大镜等效果,都需要用到了鼠标或元素在页面上的位置信息。...咱们都知道浏览器的可视区域位置是固定的不发生滚动的,所以,clientX/Y属性获取的鼠标位置不会随页面滚动而改变; 兼容性:所有浏览器都能支持。...e = e || window.event; console.log(e.offsetX); } 在click事件中把e.layerX换成e.offsetX,然后进行测试。...在IE中有一个小问题,在非IE浏览器下document.documentElement.clientTop/left值为0,而在在IE中document.documentElement.clientTop

    3.4K60

    位置编码在注意机制中的作用

    在运行 RNN 或 LSTM 时,隐藏状态保留单词在句子中的相对位置信息。...然而,在 Transformer 网络中,如果编码器包含一个前馈网络,那么只传递词嵌入就等于为您的模型增加了不必要的混乱,因为在词嵌入中没有捕获有关句子的顺序信息。...为了处理单词相对位置的问题,位置编码的想法出现了。 在从嵌入层提取词嵌入后,位置编码被添加到这个嵌入向量中。 解释位置编码最简单的方法是为每个单词分配一个唯一的数字 ∈ ℕ 。...如果我们巧妙地使用这个波动方程,我们可以在一次拍摄中捕获词嵌入的时间和维度信息。 让我们看一下这个等式,在接下来的步骤中,我们将尝试把它形象化。 ?...这是我对注意力机制中使用的位置编码的看法。在接下来的系列中,我将尝试撰写有关编码器-解码器部分的内容,并将注意力应用于现实世界的规模问题。

    2K41

    在 .NET Core 中运行 JavaScript

    一.前言 在 .NET Framework 时,我们可以通过V8.NET等组件来运行 JavaScript,不过目前我看了好几个开源组件包括V8.NET都还不支持 .NET Core ,我们如何在 .NET...Core 中运行 JavaScript 呢,答案是使用 NodeServices。...关于为何有在 .NET Core 中执行 JavaScript 这种需求,比较特殊,举个栗子:当你做模拟登录时,目标网站可能采用一些加密算法来计算特殊的值,如果你要完全模拟,那么除了用C#翻译这个算法还有个办法就是直接将这段加密算法...二.什么是 NodeServices NodeServices 是一个 ASP.NET Core 中间件,将它添加到 ASP.NET Core 管道中,该中间件调用Node在运行时执行JavaScript...首先,我们将首先创建一个包含返回问候消息的 NodeJs module 的简单JavaScript文件,保存在 scripts/greeter.js文件中: // greeter.js module.exports

    3.9K20

    JS实现获取鼠标在画布中的位置

    JS实现获取鼠标在画布中的位置 效果展示 概述 本文讲解如何实现我们平时用的画布软件中,怎么获取的我们鼠标时刻在画布中的位置。...// 首先得到鼠标在页面中的坐标( e.pageX, e.pageY) // 其次得到盒子在页面中的距离(box.offsetLeft, box.offsetTop) /.../ 用鼠标距离页面的坐标减去盒子在页面中的距离, 得到 鼠标在盒子内的坐标 // 我们生活中常见的画布里面的那个获取鼠标的位置 就是这么实现的 var box = document.querySelector...// 首先得到鼠标在页面中的坐标( e.pageX, e.pageY) // 其次得到盒子在页面中的距离(box.offsetLeft, box.offsetTop) /.../ 用鼠标距离页面的坐标减去盒子在页面中的距离, 得到 鼠标在盒子内的坐标 // 我们生活中常见的画布里面的那个获取鼠标的位置 就是这么实现的 var box = document.querySelector

    6300
    领券