javascript - 关于JS延时运行某句代码的问题，求大神帮助；-PHP中文网问答

描述你的问题
如下：
贴上相关代码
我的代码中下面这两句，总是有错，我刚开始学又不知道哪里写错了，求大神帮看看我哪里写错了。谢谢哈；

setTimeout("this.parentNode.style.backgroundColor = '#998866';" , 3000 ); //求大神帮看一下我这句代码哪里写错了，老是错误提示Uncaught TypeError: Cannot read property 'style' of undefined这个；谢谢哈

op2_a.setTimeout("offsetParent.className = 'sef3';" ,3000); //还有这句话。谢谢哈。

以下是我的整个代码

<!doctype html>
<html>
    <head>
        <meta charset="utf-8" />
        <title></title>
        <style>
            .sef{
                width: 300px;
                height: 300px;
                background-color: #992233;
                position: absolute;
                top: 50px;
                left: 50px;
            }
            .sef2{
                width: 200px;
                height: 200px;
                background-color: #001133;
                position: relative;
                top: 0px;
                left:0px;
                color: #fff;
            }
            .sef3{
                width: 500px;
                height: 500px;
                background-color: #603301;
                position: relative;
                top: 100px;
                left:110px;
                color: #fff;
            }
            a:link{
                color: #fff;
            }
        </style>
        <script>
            window.onload = function(){
                var op1_a = document.getElementById('op1');
                var op2_a = op1_a.getElementsByTagName('p')[0];
                var Al_1 = op2_a.getElementsByTagName('a');
                for(var i=0; i<op2_a.childNodes.length;i++){
                    //li背景变色 
                    if(op2_a.childNodes[i].nodeType == 1){
                        //alert(op2_a.childNodes[i].innerHTML.length);
                        if(op2_a.childNodes[i].innerHTML.length % 2 == 0){
                            op2_a.childNodes[i].style.backgroundColor = '#003322';
                        }
                        else{
                            op2_a.childNodes[i].style.backgroundColor = '#339922';
                        }
                    }
                };
                
                //通过点击A标签里的隐藏链接隐藏父元素LI
                for(var i=0; i<Al_1.length;i++){
                    
                    //alert(Al_1[i].innerHTML);
                    Al_1[i].onclick = function(){
                        this.parentNode.style.backgroundColor = '#998866';
                        //this.parentNode.style.display = 'none';
                    setTimeout("this.parentNode.style.backgroundColor = '#998866';" , 3000 ); //求大神帮看一下我这句代码哪里写错了，老是错误提示Uncaught TypeError: Cannot read property 'style' of undefined这个；谢谢哈
                        
                }
                
            }
                //子元素通过定位查找父元素；
                alert(op2_a.offsetParent);
                op2_a.setTimeout("offsetParent.className = 'sef3';" ,3000); //还有这句话。谢谢哈。
                
            }
        </script>
    </head>
    <body>
        <p class="sef" id="op1">
            <p class="sef2">
                <li>ss<a href="javascript:;">隐藏</a></li>
                <li>saa<a href="javascript:;">隐藏</a></li>
                <li>a<a href="javascript:;">隐藏</a></li>
                <li>sasasa<a href="javascript:;">隐藏</a></li>
                <li>ss<a href="javascript:;">隐藏</a></li>
                <li>saa<a href="javascript:;">隐藏</a></li>
                <li>a<a href="javascript:;">隐藏</a></li>
                <li>sasasa<a href="javascript:;">隐藏</a></li>
            </p>
        </p>
    </body>
</html>

Al_1[i].onclick = function(){ this.parentNode.style.backgroundColor = '#998866'; var self = this; setTimeout(function() { self.parentNode.style.backgroundColor = '#998866'; }, 3000) }

全部回复(4)

PHPz2017-04-10 17:02:53 4楼

可以尝试使用闭包

赞 +0

添加回复

天蓬老师2017-04-10 17:02:53 3楼

setTimeout("this.parentNode.style.backgroundColor = '#998866';" , 3000 );

setTimeout运行的作用域是全局的（window），所以上面的代码中this就为window。所以实际运行为:

window.parentNode.style.backgroundColor = '#998866';

所以就错误了。

怪我咯2017-04-10 17:02:53 2楼

将字符串传递给setTimeout函数的第1个参数，那么JS将试图执行传入的代码字符串，
效果同下，函数体中的this指向全局对象，parentNode这个属性是没有的。就会出错

setTimeout(function(){
    this.parentNode.style.backgroundColor = '#998866';
} , 3000 );

op2_a.setTimeout("offsetParent.className = 'sef3';" ,3000); //还有这句话。谢谢哈。

setTimeout是全局函数，window对象才有这个属性，DOM元素是没有个这个方法的

怪我咯2017-04-10 17:02:53 1楼

建议你先去看一下js的setTimeout的用法，setTimeout是window级别的，直接p去调用不合适吧，还有set Timeout里面应该是function吧，直接传字符串不合适吧