Javascript 下拉选择倒计时-不断更改

很抱歉标题不好，不太确定如何命名

然而，正在发生的问题是：

每当从下拉列表中选择多个值（一个接一个）而不刷新时，倒计时将在彼此之间不断闪烁

HTML:

<div id="countdown">Please select a value</div>
<select id="Dropdown" onchange="Run()">
  <option value="50">Nothing</option>
  <option value="1">Re:Zero kara Hajimeru Isekai Seikatsu</option>
  <option value="2">Kabaneri of the Iron Fortress</option>
  <option value="3">Boku no Hero Academia</option>
</select>

请选择一个值
没有什么
回复：Zero kara Hajimeru Isekai Seikatsu
铁堡垒的卡巴内里
博库没有英雄

JS:

函数运行（）{
var_s=document.getElementById（“下拉菜单”）；
var s=_s.options[_s.selectedIndex].value；
如果（s==50）{
var end=新日期（“2016年2月25日00:00上午”）；
}如果（s==3），则为else{
var end=新日期（“2016年5月22日下午6:30”）；
}如果（s==2），则为else{
var end=新日期（'2016年5月20日上午9:00'）；
}如果（s==1），则为else{
var end=新日期（'2016年5月23日凌晨3:00'）
}
var_秒=1000；
var _minute=_second*60；
变量(小时)=(分钟)*60 ;；
var _日=_小时*24；
无功定时器；
函数showLeving（）{
var now=新日期（）；
var距离=结束-现在；
如果（距离<0）{
清除间隔（计时器）；
document.getElementById（'countdown'）.innerHTML=“它已经出来了；”）；
返回；
}
var天数=数学楼层（距离/天数）；
var小时=数学楼层（（距离%\u天）/\u小时）；
var分钟=数学楼层（距离%\u小时）/\u分钟）；
var秒=数学楼层（（距离%\u分钟）/\u秒）；
document.getElementById（'countdown'）.innerHTML=days+'days'，+hours+'hours'，+minutes+'minutes'，+seconds+'seconds'；
}
定时器=设置间隔（显示剩余，1000）；
如果（s==50）{
document.getElementById（'countdown'）。innerHTML=“不选择任何内容；”）
结束；
}
}

每次在下拉菜单

change

上调用

Run（）。（JavaScript中的变量具有函数级作用域。一旦它们超出作用域，就会被垃圾收集）。因此，在您的代码中，
clearInterval（timer）
永远不会被成功调用（日志将显示未定义），因为更改下拉列表时，
timer
超出了
范围

因此，将
计时器设置为全局，并在每次
更改时调用
clearInterval
，如下所示：


var定时器；//创建一个全局计时器变量
函数运行（）{
console.log（timers）；//观察它是否保存上一个计时器值
clearInterval（计时器）；//每次在此清除间隔
var_s=document.getElementById（“下拉菜单”）；
var s=_s.options[_s.selectedIndex].value；
如果（s==50）{
var end=新日期（“2016年2月25日00:00上午”）；
}如果（s==3），则为else{
var end=新日期（“2016年5月22日下午6:30”）；
}如果（s==2），则为else{
var end=新日期（'2016年5月20日上午9:00'）；
}如果（s==1），则为else{
var end=新日期（'2016年5月23日凌晨3:00'）
}
var_秒=1000；
var _minute=_second*60；
变量(小时)=(分钟)*60 ;；
var _日=_小时*24；
函数showLeving（）{
var now=新日期（）；
var距离=结束-现在；
如果（距离<0）{
清除间隔（计时器）；
document.getElementById（'countdown'）.innerHTML=“它已经出来了；”）；
返回；
}
var天数=数学楼层（距离/天数）；
var小时=数学楼层（（距离%\u天）/\u小时）；
var分钟=数学楼层（距离%\u小时）/\u分钟）；
var秒=数学楼层（（距离%\u分钟）/\u秒）；
document.getElementById（'countdown'）.innerHTML=days+'days'，+hours+'hours'，+minutes+'minutes'，+seconds+'seconds'；
}
定时器=设置间隔（显示剩余，1000）；
console.log（timers）；//观察此处设置的值
如果（s==50）{
document.getElementById（'countdown'）。innerHTML=“不选择任何内容；”）
结束；
}
}
请选择一个值
没有什么
回复：Zero kara Hajimeru Isekai Seikatsu
铁堡垒的卡巴内里
博库没有英雄

function Run() {
  var _s = document.getElementById("Dropdown");
  var s = _s.options[_s.selectedIndex].value;

  if (s == 50) {
    var end = new Date('02/25/2016 00:00 AM');
  } else if (s == 3) {
    var end = new Date('05/22/2016 6:30 PM');
  } else if (s == 2) {
    var end = new Date('05/20/2016 9:00 AM');
  } else if (s == 1) {
    var end = new Date('05/23/2016 3:00 AM')
  }


  var _second = 1000;
  var _minute = _second * 60;
  var _hour = _minute * 60;
  var _day = _hour * 24;
  var timer;

  function showRemaining() {
    var now = new Date();
    var distance = end - now;

    if (distance < 0) {

      clearInterval(timer);
      document.getElementById('countdown').innerHTML = "It's out already ;)";

      return;
    }

    var days = Math.floor(distance / _day);
    var hours = Math.floor((distance % _day) / _hour);
    var minutes = Math.floor((distance % _hour) / _minute);
    var seconds = Math.floor((distance % _minute) / _second);

    document.getElementById('countdown').innerHTML = days + ' days, ' + hours + ' hours, ' + minutes + ' minutes, ' + seconds + ' seconds.';

  }

  timer = setInterval(showRemaining, 1000);

  if (s == 50) {
    document.getElementById('countdown').innerHTML = "Don't select nothing ;)"
end;
  }
}