相同的JavaScript两次导致滑块上的冲突

Question

我试图使用相同的JavaScript在同一页上使图像滑块和文本滑块。但有些如何无法正常工作。我对此进行了一些研究，但我发现的唯一情况是不使用冲突，但它也不起作用。当我排除编号为1的JavaScript代码时，编号为2的滑块可以正常工作，但当包含编号为1的滑块时，编号2不能正常工作。有没有办法避免彼此冲突？如果是的话，我该怎么做？这里是我的JavaScript代码：

 <script> //number-2 
      sliderInt = 1; 
      sliderNext = 2; 

      $(document).ready(function() { 
       $('#slider > img#1').fadeIn(150); 
       startSlider(); 
      }) 

      function startSlider() { 

       count = $('#slider > img').size(); 

       loop = setInterval(function() { 

        if(sliderNext > count) { 
         sliderInt = 1; 
         sliderNext = 1; 
        } 

        $('#slider > img').fadeOut(150); 
        $('#slider > img#' + sliderNext).fadeIn(150); 

        sliderInt = sliderNext; 
        sliderNext = sliderNext + 1; 
       }, 3000); 

      } 

      function prev() { 
       newSlide = sliderInt - 1; 
       showSlide(newSlide); 
      } 

      function next() { 
       newSlide = sliderInt + 1; 
       showSlide(newSlide); 
      } 

      function stopLoop() { 
       window.clearInterval(loop); 
      } 

      function showSlide(id) { 

       stopLoop(); 

       if(id > count) { 
        id = 1; 
       }else if(id < 1) { 
        id = count; 
       } 

       $('#slider > img').fadeOut(150); 
       $('#slider > img#' + id).fadeIn(150); 

       sliderInt = id; 
       sliderNext = id + 1; 

       startSlider(); 

      } 

      $('#slider > img').hover(

       function() { 
        stopLoop(); 
       }, 
       function() { 
        startSlider(); 
       } 

       // In the End of the line don't put comma ',' 

      ); 

     </script> 

     <script> //number-1 

      textsliderInt = 1; 
      textsliderNext = 2; 

      $(document).ready(function() { 
       $('#slider_text > p#1').fadeIn(300) 
       textsliderStart(); 
      }) 

      function textsliderStart() { 
       count = $('#slider_text > p').size(); 

       loop = setInterval(function() { 

        if(textsliderNext > count) { 
         textsliderInt = 1; 
         textsliderNext = 1; 
        } 

        $('#slider_text > p').fadeOut(300); 

        $('#slider_text > p#' + textsliderNext).fadeIn(300); 

        textsliderInt = textsliderNext; 
        textsliderNext = textsliderNext + 1; 
       }, 3000) 
      } 
     </script> 

Answer 1

把var在count = $('#slider_text > p').size();和loop = setInterval(function() {

前面。当你不使用VAR你在全球范围内宣布计数和循环