87,910
社区成员
发帖
与我相关
我的任务
分享clearInterval 没有效果，求大神们帮助。
代码如下：点击按钮后并没有清除setInterval；
clearInterval函数并没有效果，请问这是为什么？？？
应该怎么改写代码？？
clearInterval函数并没有效果，请问这是为什么？？？
应该怎么改写代码？？
$().ready(function(){
var chucunqi = new Array();
var lianxufashe;
$(".fashe").click(function(){
var Jxindanmu = $("#shurukuang").val().trim();
//判断弹幕是否为空值或者空格
if(Jxindanmu == ""||Jxindanmu == null||Jxindanmu == " " ){
return false;
}
else {
//先发射一个当前的弹幕
//创建一个段落
/*
var fashedexindanmu = $("<p>"+Jxindanmu+ "</p>" );
//随机一个高度
*/
//随机一种颜色
$("<p>"+Jxindanmu+ "</p>" )
.css( {"position":"absolute", "right": "0px", "font-size":"30px", "top":function () {return Math.floor(Math.random()*401) } } )
.css("color",function () {
var hongse1 = Math.floor( Math.random()*256 );
var lvse1 = Math.floor( Math.random()*256 );
var lanse1 = Math.floor ( Math.random()*256 );
return "rgb("+hongse1+","+lvse1+ ","+ lanse1 + ")"
} )
.appendTo(".main")
.animate({"right":"1200px"},8000, function(){$(this).remove() } );
// fashedexindanmu.appendTo(".main");
//将新弹幕加入到储存
var xindanmu = document.getElementById("shurukuang").value ;
chucunqi.push(xindanmu);
$("#shurukuang").val("");
console.log(chucunqi);
//随机发射一条弹幕 随机高度 随机颜色
var chucunqichangdu = chucunqi.length;
console.log(chucunqichangdu);
function suijidanmu () {
//随机一个INDEX
var index = Math.floor( Math.random()*chucunqichangdu );
console.log( index );
//发射随机出来的弹幕
$("<p>"+chucunqi[index]+ "</p>" )
.css( {"position":"absolute", "right": "0px", "font-size":"30px", "top":function () {return Math.floor(Math.random()*401) } } )
.css("color",function () {
var hongse2 = Math.floor( Math.random()*256 );
var lvse2 = Math.floor( Math.random()*256 );
var lanse2 = Math.floor ( Math.random()*256 );
return "rgb("+hongse2+","+lvse2+ ","+ lanse2 + ")"
} )
.appendTo(".main")
.animate({"right":"1200px"},8000, function(){$(this).remove() } );
}
//不断重复发射弹幕
lianxufashe = setInterval( suijidanmu,5000 );
}
} );
$(".qingping").click(function(){
$("p").remove();
clearInterval(lianxufashe);
function qingkongshuzu () {
if( chucunqi[0] ){
chucunqi.shift();
console.log( chucunqi );
return qingkongshuzu() ;
}
}
qingkongshuzu();
} )
} )
...全文
请发表友善的回复…
发表回复
hopperhuang 2016-07-19
- 打赏
- 举报
还是不行，停不下来。
还是连续不断发射undefined的弹幕，让人头疼。
bigbird_561 2016-07-19
- 打赏
- 举报
lianxufashe = self.setInterval( suijidanmu,5000 );
lianxufashe=window.clearInterval(lianxufashe);
cheery_an 2016-07-19
- 打赏
- 举报
出现undefine的原因是因为，你连续单 击“发射”，调用了多次 lianxufashe = setInterval(suijidanmu, 5000);，实际上是有多个定时器了，而你只用了一个变量来记录，所以 clearInterval只清除了最后一个计时器。而你的 “chucunqi”是同一个，就会在suijidanmu的时候出现undefine。
cheery_an 2016-07-19
- 打赏
- 举报
你确定不是其他问题么，看下js那些报错没有。这代码表示没问题。
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
body, html {
width: 100%;
height: 100%;
margin: 0;
font-family: "微软雅黑";
}
#control {
width: 100%;
}
</style>
<script type="text/javascript" src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<title>设置线、面可编辑</title>
</head>
<body>
<div id="control">
<input id="shurukuang" value="20"/>
<button class="fashe">发射</button>
<button class="qingping">停止</button>
</div>
<div class="main"></div>
</body>
</html>
<script type="text/javascript">
$().ready(function(){
var chucunqi = new Array();
var lianxufashe;
$(".fashe").click(function () {
var Jxindanmu = $("#shurukuang").val().trim();
//判断弹幕是否为空值或者空格
if (Jxindanmu == "" || Jxindanmu == null || Jxindanmu == " ") {
return false;
}
else {
//先发射一个当前的弹幕
//创建一个段落
/*
var fashedexindanmu = $("<p>"+Jxindanmu+ "</p>" );
//随机一个高度
*/
//随机一种颜色
$("<p>" + Jxindanmu + "</p>")
.css({ "position": "absolute", "right": "0px", "font-size": "30px", "top": function () { return Math.floor(Math.random() * 401) } })
.css("color", function () {
var hongse1 = Math.floor(Math.random() * 256);
var lvse1 = Math.floor(Math.random() * 256);
var lanse1 = Math.floor(Math.random() * 256);
return "rgb(" + hongse1 + "," + lvse1 + "," + lanse1 + ")"
})
.appendTo(".main")
.animate({ "right": "1200px" }, 8000, function () { $(this).remove() });
// fashedexindanmu.appendTo(".main");
//将新弹幕加入到储存
var xindanmu = document.getElementById("shurukuang").value;
chucunqi.push(xindanmu);
$("#shurukuang").val("");
console.log(chucunqi);
//随机发射一条弹幕 随机高度 随机颜色
var chucunqichangdu = chucunqi.length;
console.log(chucunqichangdu);
function suijidanmu() {
//随机一个INDEX
var index = Math.floor(Math.random() * chucunqichangdu);
console.log(index);
//发射随机出来的弹幕
$("<p>" + chucunqi[index] + "</p>")
.css({ "position": "absolute", "right": "0px", "font-size": "30px", "top": function () { return Math.floor(Math.random() * 401) } })
.css("color", function () {
var hongse2 = Math.floor(Math.random() * 256);
var lvse2 = Math.floor(Math.random() * 256);
var lanse2 = Math.floor(Math.random() * 256);
return "rgb(" + hongse2 + "," + lvse2 + "," + lanse2 + ")"
})
.appendTo(".main")
.animate({ "right": "1200px" }, 8000, function () { $(this).remove() });
}
//不断重复发射弹幕
lianxufashe = setInterval(suijidanmu, 5000);
}
});
$(".qingping").click(function () {
$("p").remove();
clearInterval(lianxufashe);
function qingkongshuzu() {
if (chucunqi[0]) {
chucunqi.shift();
console.log("stop:" + chucunqi);
return qingkongshuzu();
}
}
qingkongshuzu();
});
} )
</script>
