javascript - 如何使用内联 javascript 代码自动居中弹出窗口

Question

我有一个在 AJAX 中使用的内联 javascript，希望在打开时自动居中，但只在内联脚本中进行更改。那可能吗？这是我的代码：

<a href='javascript:void(0)' title='owner' onclick=\"window.open('owner.html','owner','height=320, width=300,location=no,scrollbars=yes')\ >some text</a>

Answer 1

我使用了逼真的答案并使它起作用：

<a onclick="javascript:void window.open('http://www.google.com','1380642102467','width=400,height=300,resizable=1,left='+(screen.width/2-200)+',top='+(screen.height/2-150));return false;" href="http://www.google.com"><u>CLICK HERE</u></a>

主要区别在于本节：

left='+(screen.width/2-200)+'
top='+(screen.height/2-150)

我发现如果在 (screen.) 参数中减去一半的窗口大小，则减去窗口大小的差异是有效的。-200 和 -150 部分是从我的弹出窗口大小的一半计算出来的（在“宽度”和“高度”中手动输入）。我不知道是否有基于不同弹出窗口大小的更动态的方法，但我个人不需要它来做到这一点，并且可以输入静态值。

我也需要它完全内联。我需要使用它的地方不允许更改头部或添加其他文件。我仅限于上传正文 HTML。

希望这可以帮助！

Answer 2

您需要计算left并将top计算值作为参数提供给window.open()调用。我不确定您为什么希望 JavaScript 内联，最好在单独的调用中完成，以便您可以从所有地方调用相同的函数。

Left = (screen.width / 2) - (Provided Width of the Popup / 2)
Top  = (screen.height / 2) - (Provided Height of the Popup / 2)   

仅发布相关代码 -

window.open('owner.html','owner','height=320, width=300,location=no,scrollbars=yes,left=' + (screen.width/2)-(300/2) + ',top=' + (screen.height/2)-(320/2))