新しいjsを追加すると既存のものが機能しなくなります。

###問題の詳細
新js（指定した期間で画像の表示非表示を切り替える）を追加すると、既存js（メインビジュアルのスライダー）の次の画像に切り変える機能（手動、自動共に）が動かなくなります。
まず、既存のスライダーがなぜ動かなくなったかを調べるにはどうすればよいでしょうか？

ちなみに、新js＞既存jsの順番で<head>の一番最後に読み込んでいます。

問題のページ

※リンク先のページでconsoleエラーがいくつかありますが、既存jsが問題なく動いていたときからあるものなので今回の問題に関係する可能性は低いと思われます。

原因の可能性がある箇所
以下の画像はスライダーの一枚目に新jsを設定し現在は非表示になるようにしたものなのですが、画像は非表示中でもページャーでは1枚としてカウントされています。（画像の赤丸部分、本来は点が4つなるはず）これにより、スライダー数のカウントがおかしくなり動かない原因になっているのではと思われます。

新jsの関連コードについて
以下のコードと

<script>
jQuery(function($){
  $(".view_timer").each(function(index, target) {
    var startDate = $(this).attr("data-start-date");
    var endDate = $(this).attr("data-end-date");
    var nowDate = new Date();

    if (startDate) {
      startDate = new Date(startDate);
    } else {
      startDate = nowDate;
    }
    if (endDate) {
      endDate = new Date(endDate);
    }

    if (startDate <= nowDate && (!endDate || nowDate <= endDate)) {
      $(this).show();
    } else {
      $(this).hide();
    }
  });
});
</script>

指定した期間で表示非表示を切り替える部分に以下のコードを追加することで機能します。

class="view_timer" data-start-date="2017/5/26 09:50" data-end-date="2017/5/26 09:59"

既存のjsの関連コード

<script>
jQuery.noConflict();
jQuery(document).ready(function(){
     jQuery('.bxslider').bxSlider({
          auto: true,

          pause: 9000,  /*停止時間*/
          speed: 2000
        
	});
});
</script>

以上、お手数ですが助言をいただければと幸いです。

m.ts10806

2017/05/31 05:59

Chromeのデベロッパーツールで見ると結構いろんなエラー出ているように見受けられますが、ひとまず一通りエラーを解消してからの方がいいかもしれません・・・。何が干渉しあっているのかが分かりづらくなりますし、何ができて、何ができていないのかも見えづらくなります。

h-o

2017/05/31 06:40

質問への追記・修正の依頼ありがとうございます。全ては難しそうですができそうなものから対処してみます。

行動規範の内容に同意します

回答1件

ベストアンサー

現状のコードからの推測ですが前提として、
jQuery(document).ready(function()とjQuery(function($)は同じです。

参考URL：【jQuery】処理実行タイミング $(document).readyと$(window).load

新コードを先に書いていて順番に上から順番に流れているようですが、同じ意味で同じタイミングで動作するので先に書いたからといって先に処理が終わるとは限りません。
新コードで非表示にしたい情報を探りきる前に旧コードが動作するとスライダーは出来上がってしまうわけですし。
確実に旧コードを後に走らせたいのであれば、新コードの中で最後に入れると良いでしょう。
それでダメなら「新コードが終わるのを待って」という対応をしてみてください。
when()～done()というのがあります。参考：【jQuery】処理が終わってから次の処理を実行する

あと、hide()ではなくremove()も試してみてください。hide()はdisplay:hiddenにして画面上見えなくするだけなのでremove()で物理的に削除した方がいいかもしれません。
※何かのイベントで再表示する必要があるのならremove()では対応しきれませんが。

投稿2017/05/31 08:13

m.ts10806

総合スコア80850