当前位置:   article > 正文

a href链接弹出新窗口的方法_href打开新窗口

href打开新窗口

如今大部分浏览器都是标签式的浏览器,即打开一个链接时默认情况一般都在本标签或新开一个标签页打开,但是有时候我们想弹出一个新的小窗口显示页面,那么如何设置呢?

1,直接定义链接的target为_blank

仅仅使用<a href="...." target="_blank">。。。</a>是不够的,这个一般只会在新标签页中打开。

2,定义onclick事件处理函数

  1. <script type="text/javascript">
  2. function openNewWin(url)
  3. {
  4. window.open(url);
  5. }
  6. </script>
  7. <a οnclick=openNewWin("http://www.google.com")>google</a>
这种方式也是在新标签页中打开,而且这种方式由于没有定义href,所以这个链接并没有表现出链接的样式。

3,不写onclick事件,在href中写javascript代码

  1. <script type="text/javascript">
  2. function openNewWin(url, title)
  3. {
  4. window.open(url, title);
  5. }
  6. </script>
  7. <a href="javascript:openNewWin("http://www.google.com", "google")>google</a>
这种方式也是在新标签页中打开,但是我们定义了href,所以显示出链接的样式。

4,定义window.open的第三个参数,实现在新窗口中打开

window.open是浏览器窗口对象的打开函数,原型如下:

var windowObjectReference = window.open(strUrl, strWindowName[, strWindowFeatures]);
strWindowFeatures非常丰富,如下图所示:



所有这些属性的设置方式是:prop=yes或者prop=1,或者prop,表示启用这个属性,prop=no表示没有这个属性。属性有:

menubar,toolbar,status,location……,这些属性不是所有浏览器都支持。

详见:https://developer.mozilla.org/en-US/docs/Web/API/Window.open
如果不指定第三个参数,则默认在新标签页中打开,如果指定了,则在新窗口中打开,所以代码需要这么写:

  1. <script type="text/javascript">
  2. function openNewWin(url, title)
  3. {
  4. window.open(url, title, "location=no,status=no,scrollvars=no");
  5. }
  6. </script>
  7. <a href="javascript:openNewWin("http://www.google.com", "google")>google</a>


声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/你好赵伟/article/detail/188432?site
推荐阅读
相关标签
  

闽ICP备14008679号