李大仁博客

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

李大仁

最近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最近会把方法放上跟大家分享
，大家期待吧。

Exit mobile version