为什么我的取消没办法实现

为什么我的取消没办法实现

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>定时器</title>

    <style type="text/css">

        div{width:400px;height:120px;margin-top:50px;border:2px solid gray;padding:10px;}

    </style>

</head>

<body>

     <input type="button" value="删除">

     <input type="button" value="取消删除">

    <div>点击"删除"按钮后,里面的内容将在3秒钟后消失;<br/><br/>如点击了"删除"后又不想删除内容,请在点击"删除"按钮3秒之内点击"取消删除"按钮即可</div>

    <script type="text/javascript">

       //补充代码

       var deletes=document.getElementsByTagName("input")[0];

       var cancel=document.getElementsByTagName("input")[1];

       var div=document.getElementsByTagName("div")[0];

       deletes.onclick=function del(){

             div.innerHTML="";

           }

       

       var dels=setTimeout(del,3000);

       cancel.onclick=function(){

           clearTimeout(dels);

       }

    </script>

</body>

</html>


正在回答 回答被采纳积分+1

登陆购买课程后可参与讨论,去登陆

2回答
好帮手慕码 2019-05-30 11:30:12

同学你好!
是可以实现的哦~同学可以看下是没有在全局中命名dels变量

js代码可参考:

<script type="text/javascript">
       //补充代码
       var deletes=document.getElementsByTagName("input")[0];
       var cancel=document.getElementsByTagName("input")[1];
       var div=document.getElementsByTagName("div")[0];
       var dels;//需要定义全局变量
       deletes.onclick=function(){
       	 dels=setTimeout(function(){
             div.innerHTML="";
           
        },3000)
       }
       // var dels=setTimeout(del,3000); 这个无用,可删掉
       cancel.onclick=function(){
           clearTimeout(dels);
       }
    </script>

同学可以测试一下这个~

如果帮助到了你 欢迎采纳 祝学习愉快~

好帮手慕码 2019-05-30 10:51:41

同学你好!

应该把定时器放在点击事件里面:触发点击事件,之后定时器才去执行

http://img1.sycdn.imooc.com//climg/5cef44f20001ddce08420600.jpg

如果帮助到了你 欢迎采纳 祝学习愉快~

  • 提问者 慕仙3144158 #1
    这样改我的取消删除还是没办法实现,之前就可以实现删除效果
    2019-05-30 11:18:08
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师