Miss_Audrey
Miss_Audrey
2017-02-16 04:00

DOM7011: 此页上的代码禁用了反向和正向缓存,怎么解决?

1
  • 浏览器
  • 缓存

为什么ie浏览器打开时某些js效果不出来,其他浏览器都正常,提示DOM7011: 此页上的代码禁用了反向和正向缓存,怎么回事儿?

 <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        #leftDiv{
            width:185px;
            height:300px;
            border:1px solid lightgray;
            float: left;
            margin: 10px;
        }
        p{
            margin: 0;
            padding: 0;
        }
        #middleDiv{
            width: 40px;
            height:300px;
            float: left;
            padding-top: 20px;
        }
        button{
            margin-top:20px;
        }
        #rightDiv{
            width:185px;
            height: 300px;
            border:1px solid lightgray;
            float: left;
            margin:10px;
        }
        .selected{background-color: green;}

    </style>
    <script>
        window.onload=function()
        {
            var bigDiv=document.getElementById("bigDiv");
            var leftDiv=document.getElementById("leftDiv");
            var middleDiv=document.getElementById("middleDiv");
            var rightDiv=document.getElementById("rightDiv");
            var moveBtn=document.getElementById("moveBtn");
            var moveAllBtn=document.getElementById("moveAllBtn");
            var backBtn=document.getElementById("backBtn");
            var backAllBtn=document.getElementById("backAllBtn");
            var p=bigDiv.getElementsByTagName("p");

            for(var i=0;i< p.length;i++)
            {
                var pElements=p.item(i);

                //鼠标移到列表,背景颜色改变,移去时消失
                pElements.onmouseover=function(){
                    this.style.backgroundColor="lightgreen";
                }
                pElements.onmouseout=function(){
                    this.style.backgroundColor=null;
                }

                //单击时选中,再次单击回到原来的状态
                pElements.onclick=function(){
                    if(this.className=="selected")
                    {
                        this.className=null;
                    }else{
                        this.className="selected";
                    }
                }

                //鼠标双击时列表被移到另一个div里面
                pElements.ondblclick=function(){
                    if(this.parentNode.id=="leftDiv"){
                        rightDiv.appendChild(this);
                    }else{
                        leftDiv.appendChild(this);
                    }
                }
            }

            //给按钮添加效果
            //点击向右移动按钮时,被选中的列表被移到右侧,并且选中状态消失
            moveBtn.onclick=function(){
                var p=leftDiv.getElementsByTagName("p");//因为是向右移动,所以要从左边的div里获取p元素
                for(var i=0;i< p.length;i++){
                    var pElements= p.item(i);
                    if(pElements.className=="selected")
                    {
                        rightDiv.appendChild(pElements);
                        pElements.className=null;
                        i--;
                    }
                }

            }
            //点击向左移动按钮时,被选中的列表被移到左侧,并且选中状态消失
            backBtn.onclick=function(){
                var p=rightDiv.getElementsByTagName("p");
                for(var i=0;i< p.length;i++){
                    var pElements= p.item(i);
                    if(pElements.className=="selected")
                    {
                        leftDiv.appendChild(pElements);
                        pElements.className=null;
                        i--;
                    }
                }

            }
            //点击全部右移按钮时,左侧所有的元素全部被移到右侧
            moveAllBtn.onclick=function(){
                var p=leftDiv.getElementsByTagName("p");
                while(p.length>0){
                    var pElements= p.item(0);
                    rightDiv.appendChild(pElements);
                    pElements.className=null;
                }
            }
            //点击全部左移按钮时,右侧所有的元素全部被移到左侧
            backAllBtn.onclick=function(){

                var p=rightDiv.getElementsByTagName("p");

                while(p.length>0){
                    var pElements= p.item(0);
                    leftDiv.appendChild(pElements);
                    pElements.className=null;
                }
            }
        }

    </script>
</head>
<body>
<div id="bigDiv">
    <div id="leftDiv">
        <p>蛋蛋</p>
        <p>曹儿</p>
        <p>咸咸</p>
        <p>传小艳</p>
    </div>
    <div id="middleDiv">
        <button id="moveBtn">&gt;&gt;</button>
        <button id="moveAllBtn">&gt;&gt;&gt;</button>
        <button id="backBtn">&lt;&lt;</button>
        <button id="backAllBtn">&lt;&lt;&lt;</button>
    </div>
    <div id="rightDiv"></div>
</div>
</body>
</html>
  • 点赞
  • 回答
  • 收藏
  • 复制链接分享

1条回答