老师，我有一个问题
来源：1-21 编程练习
慕无忌4228145
2020-12-29 15:36:32
# 具体遇到的问题
# 报错信息的截图
# 相关课程内容截图
# 尝试过的解决思路和结果
# 粘贴全部相关代码，切记添加代码注释（请勿截图）
在这里输入代码，可通过选择【代码语言】突出显示
我想用那个匿名函数的方式达到效果，可能我对格式有理解错误，不知道如何弄才能达到想要的效果
<!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 btn1=document.getElementsByTagName('input')[0];
var btn2=document.getElementsByTagName('input')[1];
var div=document.getElementsByTagName('div')[0];
btn1.onclik=function(){
setTimeout(function(){
text=div.innerHTML='';
},3000);
btn2.onclick=function(){
clearTimeout(text);
}
}
</script>
</body>
</html>
1回答
-
好帮手慕言
2020-12-29
同学你好，同学提供的代码中，存在以下问题：
1、单词拼写错误，正确的拼写为onclick，如下：
2、clearTimeout方法的参数，是setTimeout() 的返回的ID值，建议：定义一个变量来接收setTimeout() 的返回的ID值，如下：
3、第二个按钮的点击事件，放在第一个按钮点击事件的外面，代码可读性会更好
修改后的代码：
<script type="text/javascript">
//补充代码
var btn1 = document.getElementsByTagName('input')[0];
var btn2 = document.getElementsByTagName('input')[1];
var div = document.getElementsByTagName('div')[0];
var timer;
// btn1.onclik = function () {
btn1.onclick = function () {
timer = setTimeout(function () {
// text = div.innerHTML = '';
// text用不到，改为下方写法，代码更简洁
div.innerHTML = '';
}, 3000);
// btn2.onclick = function () {
// // clearTimeout(text);
// clearTimeout(timer);
// }
}
// 第二个按钮的点击事件，放在第一个按钮点击事件的外面，代码可读性会更好
btn2.onclick = function () {
// clearTimeout(text);
clearTimeout(timer);
}
</script>祝学习愉快~
0
