原来的SOSO里面有“我的订阅”这一项，改版以后好不容易找到了，可是原来订阅的关键字都没有了 ，而且我的收藏里面也没有原来收藏的内容了，能恢复吗，改版之后很难用，而且之前订阅的东西之前好久都不更新
原来的SOSO里面有“我的订阅”这一项，改版以后好不容易找到了，可是原来订阅的关键字都没有了 ，而且我的收藏里面也没有原来收藏的内容了，能恢复吗，改版之后很难用，而且之前订阅的东西之前好久都不更新 5
不区分大小写匿名
原来的时候都是可以自己添加关键词的 现在这个版本太固定 不能随意添加 只是很久没用才发现改版的
可以自己添加关键词的
等待您来回答
搜狗问问领域专家企业信息化
计算机技术
座右铭：人生的目的，在发展自己的生命，可是也有为发展生命必须牺牲生命的时候。——李大钊
【单页应用】我们该如何处理惩罚框架弹出层层级关系？日联系商易上海电子商务网站建设，了解更多
&媒介
比来总结不久不多，一方面是之前的常识点多斗劲根蒂根基，所以进修总结起来斗劲快
然则根蒂根基常识只有那么一点，如今当然可以从新常识点着手拓宽视野（这个当然要持续），然则根蒂根基堆集，再深切进修是成为优良前端必不成少的阶段
所以这块处所还得死扛，所幸如今是个优良的团队，身边高手进步前辈较多，有时辰就教是很有标的目标的，这个很是荣幸啊！
其次年后来到公司后，总有点浮浮沉沉的工作产生，而每年的3月又是各个公司&变更&的集中期，所以表情受到了一些影响，此点不成不慎啊！
搞技巧的不成浮躁！若是心思过多的花在了&人事&上，那么就真有点背道而驰了，技巧人员的核心竞争还是该当在技巧上
当然，年后会为年前干的一些工作擦，一般每个团队年前都邑有一些烂事没有做完，正好一些工作就落到了我的头上，于是进入本日的主题
因为边思虑便行文，有题目请提出。
弹出层层次关系
以我现有视野来说，单页应用应当是移动端的一个趋势，很多公司或多或少的会请求HTML5的站点发挥解析与APP趋于一致
而好的前端团队的话就会请求HTML5不减色与APP，当然这块不是不成能产生（在一两年后，应当逐渐明显）
对于非单页应用来说，弹出层的层次关系斗劲简单，然则依旧会碰到一个弹出层弹出，另一个弹出层也须要弹出的场景
而上述斗劲&少见&的场景在单页应用中就时常产生了，若是一开端没有对本身框架的层级做设计的话，后面的成长会让你感觉头疼
弹出层的题目
这里先稍微鉴戒一点这里的弹出层做申明：/jquery/layer/
PS：贤心弹出层是斗劲周全的，可以少写很多代码申明题目
小议层次关系
经由过程查看样式我们发明其z-index为：
element.style {
background-color: rgb（255， 255， 255）;
z-index: ;
height: 132px;
}
那么，我这里就会产生一个疑问，若是再弹出一个alert框呢，当然这里会有以下场景：
① 因为蒙版的存在，只容许一个alert框弹出
② 框架本身做了处理惩罚，同一类型的alert框只能有一个
③ 框架对z-index做了处理惩罚，第二次弹出的层会遮住第一个（这里还会有其它景象我们稍后再说）
④ 未做特别处理惩罚
如今，我们干一件很2B的工作，将蒙版去掉再点击尝尝：
经由过程实验发明，该作者的处理惩罚体式格式如下：
① 只容许一个alert弹出层的呈现，与上方②规划类似
② 不合类型的弹出层须要同时呈现时辰，只会保存最新的一个
比如我们这里点击询问类的弹出层时辰，再点击信息框，于是询问类的弹出层就被封闭了，再点击断定就没有了弹出层了
交叉层次处理惩罚
当碰到多个层次时辰，也是须要处理惩罚的，持续以这里的弹出层为例：我们连气儿弹出两个层
&
后出来的层会在先出来的层次之前，意思是其z-index的值斗劲高，这个时辰再加上一个loading框的话就斗劲齐备了
所以，这里我们可以得出一个结论：
作者是以先后呈现次序设计层次布局的（未读源码，具体景象不明）
而，这个还只是第一种层次关系，斗劲细心的伴侣会发明，左边有一个fixed元素：
&
而fixed元素在单页应用中多用作view的头尾，那么alert类的弹出层与fixed头尾又是什么关系呢？？
fixed头尾与弹出层
这里footer的样式如下：
.fixnav {
position: fixed;
bottom: 0;
width: 100％;
z-index: 9999;
transition: all .8s;
background: ＃206F96;
}
与上切切的弹出层来说就斗劲渺小了
&
所以弹出层应当隐瞒头尾（fixed），这个处理惩罚也是有事理的，然则这里也会有一个题目
头部是否应当被隐瞒
对于单页应用来说，头部是否应当被隐瞒呢？
这个不合的人会有不合的设法：
① 不该该被隐瞒
若是一个loading框加载失败，而代码又未做处理惩罚的话，用户除了刷新页面或者退出法度别无他法
如今很多html5代同时用于app中，而app的头部是不成隐瞒的
② 应当被隐瞒
简单而言，弹出层呈现时不隐瞒头部会引起很多BUG，对代码的结实性请求更高
比如，弹出层呈现时辰，点击撤退猬缩，若是营业代码未对弹出层作出处理惩罚的话，这个弹出层不会消散
别的，若是view切换过程中会有动画结果的话，view的会被设置为absolute，那么此时alert与页面view会有层级关系
所以，保险的规划，应当是隐瞒头部
呈现次数题目
我们看到该作者的处理惩罚是雷同的控件只能呈现一次，这个处理惩罚办法对于单页应用来说可能就有必然麻烦了：
① 我们当然可以在把握器中设置一些经常呈现的弹出层插件：
alert类，弹出层类，让他们只能呈现一次，然则实际项目中，极有可能呈现各个view对弹出层的需求不一样的需求
这个时辰我们的弹出层应当被把握么？
② 弹出层会自带蒙版（mask），这个蒙版又该呈现几次呢
③ 全屏覆盖层（告白类，或者其他）又该处于什么层次呢？？？
让我们带着这些题目一一进修本日的常识
全局独一的弹出层
由设计的角度来说，无论是呈现蒙版还是其它身分，我们对一些弹出层是只请求零丁存在的，比如，我们不会同时存在两个alert
所以，我们先收拾哪些弹出层只会呈现一次：
① alert 类警告层
②&confirm 类确认层
③ toast类消息层
④ loading类加载层
⑤ 其它类似弹出层
以上弹出层事实上全局只应当有一个，dom一旦存在就不会烧毁，然则这里也会有其它题目，比如我们这个confirm吧
同一控件不合行动
我们如今在demo01时辰点击确按时辰弹出个断定的提示，而提示相干有所不合的话......
&
&
就须要每次show的时辰传递参数复写上一次的事务等相干数据：
showConfirm: function （message， title， okFn， cancelFn， okTxt， cancelTxt） {
//若是传入的是对象的话，直接用作初始化
if （typeof message == ""object"" && message.message） {
this.confirm.setViewData（message）;
this.confirm.setViewData（{
message: message，
title: title，
buttons: [
{ text: （cancelTxt || ""作废""）， click: function （） {
if （typeof cancelFn == ""function""） { cancelFn（）; }
this.hide（）;
}， type: Alert.STYLE_CANCEL
text: （okTxt || ""断定""），
click: function （） {
if （typeof okFn == ""function""） { okFn（）; }
this.hide（）;
type: Alert.STYLE_CONFIRM
this.confirm.show（）;
}，
这块的结论是：
同一控件须要在show时辰动态改变事务句柄相干参数，以达到dom布局反复哄骗的目标
这个操纵是很简单的，有题目的是我们的mask控件，若是我们的mask控件具有点击mask封闭alert控件功能的话，景象就有所不合了
须要几个mask
我们的框架到底须要几个mask，这个题目其实斗劲关键
全局只有一个mask，dom代码清楚，这个设法很是公道，但不易操纵
怎么说呢，若是存在两个弹出层同时存在的景象，A弹出层出来后，B弹出层再出来，这个时辰A的蒙版应当比A高比B低
这个时辰关掉B，mask又应当比A低，于是我们须要去动态调剂蒙版的zindex
以上场景已经斗劲烦了，若是我们有点击蒙版封闭插件的需求的话，我们点击蒙版时辰该封闭B还是该封闭A呢？？？
景象又变得错杂起来，实现起来轻易照成BUG，所以简单的规划还是，每个弹出层为其设备一个mask，是否具有点击封闭特点由插件决意
比如loading框就不具有封闭特点，所以结论是：
为每一个弹出层设备零丁mask是斗劲简单的处理惩罚规划
阻拦弹出层层次
弹出层呈现次数断定后，第二个题目就是其呈现时辰的层级关系，我们这里采取：
按弹出层呈现先后次序断定其层级
比如我们几个层同时呈现时辰，我们就遵守其呈现次序定义谁在钱谁在后，在后面的会被蒙版遮住（这里可能会导致蒙版愈来愈黑）
&
那么这个时辰层次关系应当怎么断定呢，或者说，我怎么知道我每次取得的z-index都邑最大，这个其实就和我们前面的uuid是一个事理了
base.getBiggerzIndex = （function （） {
var diviso =
return function （） {
};
}）（）;
每次设置index时辰都在这里来获取z-index即可
header与footer
header与footer按照我们前面的设法，应当是被遮住的，所以，我们直接将其z-index设置为500即可
然则这个时辰依旧会有一些特别的景象，比如warning404等景象
404提示
一般来说，404页面应当比一般弹出层低，并且比header低，然则比footer高，为什么这么说呢
因为header可能全局只有一个，而footer来说属于单个view，比如提交订单的按钮
这个时辰404提示应当隐瞒所有的页面，然则不克不及隐瞒头部
页面层级
页面切换来说，会将view转化为absolute，这个时辰也会有必然层级的，这个时辰又会有很多题目，比如footer栏为fixed元素，全部view切换时辰他并不会跟着移动
所以，我们应当将footer栏做成组件，在切换时辰将之隐蔽
页面切换时辰的层级应当比header低，然则比一般的弹出层要高，所以我们最后可以形成以下规矩
第一级别：（0）
文档流元素
第二级别：（500）
footer类组件，须要在文档流之上，依旧属于view内部
第三级别：（1000）
404提示类，须要覆盖view内的所有元素，但不克不及隐瞒头部，属于隐瞒view内部的弹出层
第四级别：（1500）
view切换时辰的层级
此时view的层级会比404等层级高
框架切换时辰须要对弹出层进行hide
第五级别：（2000）
header类，头部
第六级别：（3000+）
一般类弹出层，按照弹出先后次序策画
结语
今天正好在收拾框架的层级关系，将思虑到的器材做了必然记录，若是各位对此有研究请不吝赐教Admin
此页面上的内容需要较新版本的 Adobe Flash Player。2746人阅读
&DIV id=&closeLayer&
onClick=&closeMe()&&&IMG src=&jiuye/close.gif& width=&15& height=&13&&&/DIV&
&div id =&jiuye&&&img src=&jiuye/jiuye1.jpg& id=&jiuyeImage& onclick=&javascript:location=''& style=&cursor:hand&/&&/div&
&style type=&text/css&&
height:540
z-index:1;
#closeLayer{
z-index:2;
&script src=&jiuye/jquery-1.8.0.js& type=&text/javascript&&&/script&
&script type=&text/javascript&&
function closeMe(){
document.getElementById(&closeLayer&).style.display=&none&;
document.getElementById(&jiuye&).style.display=&none&;
$(window).unbind();
function center() {
var obj=$(&#jiuye&);
var closeObj=$(&#closeLayer&);
var screenWidth = $(window).width(), screenHeight = $(window).height(); //当前浏览器窗口的 宽高
var scrolltop = $(document).scrollTop();//获取当前窗口距离页面顶部高度
var objLeft = (screenWidth - obj.width())/2 ;
var objTop = (screenHeight - obj.height())/2 +
obj.css({left: objLeft + 'px', top: objTop + 'px','display': 'block'});
var closeObjLeft = (screenWidth + obj.width())/2-closeObj.width()-2 ;
var closeObjTop = (screenHeight - obj.height())/2 + scrolltop+12;
closeObj.css({left: closeObjLeft + 'px', top: closeObjTop + 'px','display': 'block'});
//浏览器窗口大小改变时
$(window).resize(function() {
screenWidth = $(window).width();
screenHeight = $(window).height();
scrolltop = $(document).scrollTop();
objLeft = (screenWidth - obj.width())/2 ;
objTop = (screenHeight - obj.height())/2 +
obj.css({left: objLeft + 'px', top: objTop + 'px','display': 'block'});
var closeObjLeft = (screenWidth + obj.width())/2-closeObj.width()-2 ;
var closeObjTop = (screenHeight - obj.height())/2 + scrolltop+12;
closeObj.css({left: closeObjLeft + 'px', top: closeObjTop + 'px','display': 'block'});
//浏览器有滚动条时的操作、
$(window).scroll(function() {
screenWidth = $(window).width();
screenHeight = $(window).height();
scrolltop = $(document).scrollTop();
objLeft = (screenWidth - obj.width())/2 ;
objTop = (screenHeight - obj.height())/2 +
obj.css({left: objLeft + 'px', top: objTop + 'px','display': 'block'});
var closeObjLeft = (screenWidth + obj.width())/2-closeObj.width()-2 ;
var closeObjTop = (screenHeight - obj.height())/2 + scrolltop+12;
closeObj.css({left: closeObjLeft + 'px', top: closeObjTop + 'px','display': 'block'});
$('#closeLayer').show(300).delay(3000).fadeOut(&slow&);
$('#jiuye').show(300).delay(3000).fadeOut(&slow&,function(){
//隐藏时把元素删除
$(window).unbind();
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：342507次
积分：6013
积分：6013
排名：第1218名
原创：238篇
转载：47篇
评论：163条
(2)(2)(2)(1)(8)(4)(4)(1)(6)(4)(8)(2)(1)(1)(4)(5)(8)(1)(5)(5)(4)(16)(5)(2)(1)(2)(2)(1)(1)(2)(3)(4)(3)(1)(1)(7)(6)(1)(1)(2)(4)(8)(13)(2)(8)(32)(52)(23)(2)(4)