tab选项卡

周一的时候接到了项目文件，要求两天给出基本的展示页面。顿时压力山大！！

页面特别的简单，所以问题不大。关键是，psd切图，一点点处理。这个处理资源的过程，麻烦。

我们的工作一直需求不明晰。我的资源就是psd图，和几张完整页面的截图，别的就没有了。

为了赶时间，迅速建立文件，整理资源，能copy的，绝不重写。第二天下午，页面，以及简单的功能都给实现了。这两天，可是一点没休息。

我跟同事们远程合作，所以，交流不方便。

发给对方后，第二天，有个重要的问题。不是要做页面跳转，而是类似选项卡的功能。

我的哥，早说啊。现在呢，6个页面，对应6个css文件，对应6个js文件。还有不少的class、id重名！！怎么办呢？？

开始没想着文件整合。先试了试iframe，效果很差，而且受开发环境的影响，存在不少问题。纠结！！父子页面之间的通信也很有问题。网上都是，

document.getElementById('myiframe').contentWindow.document;此方法可以找到子页面，但是试了试不管用！！shit。

不过，子页面找父页面中的元素，直接就找到了。

 

索给了意见，整合到一个页面里，就像选项卡一样。苦逼的开始，css整合，把重名的改了，js中一样改。看瞎了我的狗眼！！

js咋办呢？我是第一次处理这个问题，大神又不在？同事那边再问我，能不能搞定？问了个菇凉，唉无地自容，好弱爆的样子！！6个文件里面的js放在6个函数里，再把这些函数整合成一个js文件。整合是完成了，可是怎么执行呢？？

想了想，6个函数里面的东西大同小异，会不会冲突，也没法封装，每个函数里很多具体数值不同。

对了，页面初始化的时候，也就是默认情况下，显示首页内容，一定要执行 index（）的。

剩下的方法咋办？？找到要执行函数的状态！什么时候执行？导航焦点切换的时候，然后就有了我们自己封装的方法（doLeft() doRight()）,执行函数问题终于解决了。用户导航焦点切换，执行对应的函数，显示不同的内容。很简单，但是没经验的我感觉畏首畏尾的。

终于解决了老大难，又出问题了。跳转页面后，返回的话，每次都是首页内容。不能回复用户跳转前的状态。

这就必须做标记了。相对我们的这个项目，就是。用户返回后得知道要执行哪个函数。我们的浏览器，有个扩展对象，global，可以做跨页面的全局变量。

这不就ok了。

var goBack=new Global('curName');

goBack的默认值是“default”哦，你要记住。

在每次焦点切换的时候，给  goBack.value='值';

这个值刚好是对应的函数名字。

这样在 window.onload=function(){

　　if(goBack.value=="default"){

　　　　index();

　　}else{

　　　　window[goBack.value]();  //字符串作为函数名，执行一个函数

　　　　goBack.value="default";　//恢复默认

　　}

}

 

后来咨询了一下，做成cookie也可以。好久没接触了，都忘了这个词了。赶紧熟悉一下！！