您的位置:首页 > Web前端 > JavaScript

用JS实现WordPress的页面导航的新页面的不同打开方式

2016-08-16 10:39 369 查看
最近CG的日语培训课程开始了,因为每天有很多的课业要完成,所以最近没有怎么更新,请大家原谅。

昨天解决了一个朋友的小问题,CG感觉解决问题的方法很简单也很实用,大家可能也会经常遇到,在这里分享给大家

问题如下,让Wordpress博客系统PHP自动生成的首页导航栏当中的多个页面的导航的链接目标可以用不同的方式打开,比如当前页面和新页面两种方式。

知道HTML的朋友可能会用taget="_self"和target="_blank"来解决,不过CG看完WP主题中自动生成代码之后发现解决时很麻烦的事情,因为该主题,PHP自动的导航栏如果只使用HTML实现的话,就只有一种方式,方案否决。

HTML不行只有求助JS来实现可以在没有页面内容中增加JS代码来实现弹窗打开,然后再将父页面返回即可,考虑如果是新打开的页面同样包含弹窗JS代码从而产生递归,设置一个窗口名验证即可解决问题。

javascript代码如下:

var pageName="demo"   //窗口名

if(window.parent.name != pageName){

window.open(document.location,pageName);	//弹出窗口

window.history.back() ;	//返回上一页面

}


说明,JS弹出窗口方式会在IE6以上版本被工具栏或IE自身禁止,因

此,如果是简单的文字页面大家可以改成showModelDialog来实现

大家如果经常登陆淘宝的话可以发现淘宝使用的showModelDialog

首先判断能否实现弹出,不允许的话就换。

javascript代码如下

var pageName="demo"   //窗口名

if(window.parent.name != pageName){

window.showModelDialog(document.location,pageName);//弹出窗口

window.history.back() ;	//返回上一页面

}


简单的JS说明,定义一个变量pageName用来保存页面的唯一标示

然后就是一个判断,用来消除递归,接着是弹出窗口,最后的当然

就是返回啦,哈哈。

使用方法比较麻烦,需要你对每个页面单独添加JS脚本,大家可以

在编辑页面时使用HTML源代码编辑,然后为你的页面选择一个唯

一的名称,修改pageName,最后加入到你的页面的最上边就可以

了。

如果要实现强制弹窗的话,大家可以考虑使用Flash来实现,很流氓

也很霸道,实现的话也并不复杂,CG最近会把方法放上跟大家分享

,大家期待吧。
--------------------------------------------------------------------------------------
- 版权声明:
- 如在本页面内无特别说明,本文内容均为[李大仁博客]原创,本文版权归[李大仁博客]所有。
- 欢迎转载,转载请务必在文章页面明显位置提供原文链接并注明出处。欢迎您在转载本文时保留本段声明。
- 文章标题:JavaScript实现网站页面导航的新页面的强制弹出方式打开
- 独立博客:李大仁博客
- 永久链接:http://www.lidaren.com/archives/479
--------------------------------------------------------------------------------------
以上内容由博客自动发布工具自动发布,最终显示内容和效果会与原文内容有所偏差,敬请谅解。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: