发新帖

[功能增强] [转]A标签的target="_blank"属性在移动端/手机端无法实现新窗口打开的解决办法

horse320 2月前 196

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

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

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

2,定义onclick事件处理函数

[html] view plain copy
  1. <script type="text/javascript">  
  2. function openNewWin(url)  
  3. {  
  4.     window.open(url);  
  5. }  
  6. </script>  
  7. <a onclick=openNewWin("http://www.google.com")>google</a>  

这种方式也是在新标签页中打开,而且这种方式由于没有定义href,所以这个链接并没有表现出链接的样式。

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

[html] view plain copy
  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是浏览器窗口对象的打开函数,原型如下:

[javascript] view plain copy
  1. 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
如果不指定第三个参数,则默认在新标签页中打开,如果指定了,则在新窗口中打开,所以代码需要这么写:

[html] view plain copy
  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>  

效果演示(首页“推荐项目”区):http://www.3kid.com/

最新回复 (0)
返回