ｓ-時間設定とカウントダウンのjs

Question

時間設定をしてバナーを表示させているのですが、
そのバナー表示にカウントダウンの表記も足したいのですが、できませんでした。

バナーが時間設定して出している2パターンのうち
1パターンしかカウントダウン表記が表示されません。

教えて頂けると助かります。

http://plusblog.jp/3719/
カウントダウンは上記のサイトを参考にしております。

すいません。
ソースを貼り付けます。

<div id="usually">
<ul class="bxslider">
<li><a href="aaa"><img src="/images/aaa.jpg" alt="aaa"><div id="CDT"></div></a></li>
<li><a href="aaa"><img src="/images/aaa.jpg" alt="aaa"></a>
</ul>
</div>

<div id="ccc">
<ul class="bxslider">
<li><a href="bbb"><img src="/images/aaa.jpg" alt=""><div id="CDT2"></div></a></li>
<li><a href="bbb"><img src="/images/aaa.jpg" alt=""></a>
</ul>
</div>
<script>
function CountdownTimer(elm,tl,mes){
 this.initialize.apply(this,arguments);
}
CountdownTimer.prototype={
 initialize:function(elm,tl,mes) {
  this.elem = document.getElementById(elm);
  this.tl = tl;
  this.mes = mes;
 },countDown:function(){
  var timer='';
  var today=new Date();
  var day=Math.floor((this.tl-today)/(24*60*60*1000));
  var hour=Math.floor(((this.tl-today)%(24*60*60*1000))/(60*60*1000));
  var min=Math.floor(((this.tl-today)%(24*60*60*1000))/(60*1000))%60;
  var sec=Math.floor(((this.tl-today)%(24*60*60*1000))/1000)%60%60;
  var milli=Math.floor(((this.tl-today)%(24*60*60*1000))/10)%100;
  var me=this;
  day++;

  if( ( this.tl - today ) > 0 ){
   if (day) timer += '<span class="cp">キャンペーン終了まであと</span><span class="day">'+day+'日</span>';
  
   this.elem.innerHTML = timer;
   tid = setTimeout( function(){me.countDown();},10 );
  }else{
   this.elem.innerHTML = this.mes;
   return;
  }
 },addZero:function(num){ return ('0'+num).slice(-2); }
}
function CDT(){
 var tl = new Date('2016/9/06 13:00:00');
 var timer = new CountdownTimer('CDT',tl,'キャンペーンは終了しました');
 timer.countDown();
}
window.onload=function(){
 CDT();
}
</script>
<script>
function CountdownTimer(elm,tl,mes){
 this.initialize.apply(this,arguments);
}
CountdownTimer.prototype={
 initialize:function(elm,tl,mes) {
  this.elem = document.getElementById(elm);
  this.tl = tl;
  this.mes = mes;
 },countDown:function(){
  var timer='';
  var today=new Date();
  var day=Math.floor((this.tl-today)/(24*60*60*1000));
  var hour=Math.floor(((this.tl-today)%(24*60*60*1000))/(60*60*1000));
  var min=Math.floor(((this.tl-today)%(24*60*60*1000))/(60*1000))%60;
  var sec=Math.floor(((this.tl-today)%(24*60*60*1000))/1000)%60%60;
  var milli=Math.floor(((this.tl-today)%(24*60*60*1000))/10)%100;
  var me=this;
  day++;

  if( ( this.tl - today ) > 0 ){
   if (day) timer += '<span class="cp">キャンペーン終了まであと</span><span class="day">'+day+'日</span>';
  
   this.elem.innerHTML = timer;
   tid = setTimeout( function(){me.countDown();},10 );
  }else{
   this.elem.innerHTML = this.mes;
   return;
  }
 },addZero:function(num){ return ('0'+num).slice(-2); }
}
function CDT2(){
 var tl = new Date('2016/a/aa aa:aa:aa');
 var timer = new CountdownTimer('CDT2',tl,'キャンペーンは終了しました');
 timer.countDown();
}
window.onload=function(){
 CDT2();
}
</script>

</script>


<script>
// 土曜日
var startday1 = new Date('2016/bb/bb 00:00:01');
var endday1 = new Date('2016/bb/bb 23:59:59');

// 日曜日
var startday2 = new Date('2016/cc/cc 00:00:01');
var endday2 = new Date('2016/cc/cc 23:59:59');

var today = new Date();

var hour =  today.getHours();
var minute =  today.getMinutes();
var time = ('0' + hour).slice(-2) + ":" + ('0' + minute).slice(-2);

document.getElementById("usually").style.display="none";
document.getElementById("ccc").style.display="none";


//土曜日の時間帯設定
if( startday1 < today && today < endday1 ){
  //9月03日（土） 07:25～13:00
     if(time >= "07:25" && time < "21:00"){
          document.getElementById("ccc").style.display="block";
          document.getElementById("usually").style.display="none";
      }
  else{
  //それ以外の時間帯
          document.getElementById("usually").style.display="block";
          document.getElementById("ccc").style.display="none";
      }
//日曜日の時間帯設定
}else if( startday2 < today && today < endday2 ){

  //9月04日（日） 08:30～14:00
      if(time >= "08:30" && time < "14:00"){
          document.getElementById("ccc").style.display="block";
          document.getElementById("usually").style.display="none";
      //}else if(time >= "18:00" && time < "19:30"){
  //18:00～19:30
         // document.getElementById("ccc").style.display="block";
         // document.getElementById("usually").style.display="none";
  }else{
  //それ以外の時間帯
          document.getElementById("usually").style.display="block";
          document.getElementById("ccc").style.display="none";
    }
//それ以外の日
}else{
          document.getElementById("usually").style.display="block";
          document.getElementById("ccc").style.display="none";

}
</script>

Comments

[kei344]

具体的にJavaScriptを質問文に追記いただいたほうが回答を得られやすいと思います。また、エラーは出ていませんか？デベロッパーツールで確認してみてください。http://eng-entrance.com/javascript-display-error

[kei344]

コードはコードブロックで囲んでいただけませんか？ ```（バッククオート3つ）で囲み、前後に改行をいれるか、コードを選択して「<code>」ボタンを押すとコードブロックになります。

[kei344]

参考にされた記事などがありましたら、追記ください。

[kei344]

「2016/a/aa aa:aa:aa」はこのように書かれていますか？また、id="usually"の要素が見当たりません。

[退会済みユーザー]

すいません。id="usually"の要素と日付を追記しております。

[kei344]

「2016/a/aa aa:aa:aa」はこのように書かれていますか？どのような値を入れるつもりかがわからない書き方をされてもこまるので、実際使う数値にしてください。

Answer 1

window.onload に関数を登録するやり方は2回行うと1回目の記述を上書きします。

// 案1
window.onload=function(){
	CDT();
	CDT2();
}
```**動くサンプル：**[https://jsfiddle.net/6rf44smf/](https://jsfiddle.net/6rf44smf/)
```JavaScript
// 案2
window.addEventListener( 'load', function() {
	CDT();
} );
window.addEventListener( 'load', function() {
	CDT2();
} );
```**動くサンプル：**[https://jsfiddle.net/6rf44smf/1/](https://jsfiddle.net/6rf44smf/1/)