Объединение нескольких функций JQuery в одну функцию

Question

Я очень новичок в jquery, и мне интересно, как объединить функции jquery. Прямо сейчас, мой код немного беспорядок! Я провел некоторое исследование и не смог нормально функционировать, когда совмещаю функции. Я не хочу, чтобы мой код выглядел так, но по крайней мере на данный момент он работает правильно (кроме Firefox). Какова наилучшая практика для объединения функций?

<script type="text/javascript"> 
$(document).ready(function() { 
    jQuery(function(){ 
     jQuery("#music").click(function() { 
     jQuery("#musicinfo").slideToggle('slow'); 
     jQuery("#fpinfo, #behindinfo, #behindinfo, #signupinfo").hide('slow'); 

     }); 
    }); 
    }); 
</script> 





<script type="text/javascript"> 
$(document).ready(function() { 
    jQuery(function(){ 
     jQuery("#fproduct").click(function() { 
     jQuery("#fpinfo").slideToggle('slow'); 
     jQuery("#musicinfo, #behindinfo, #behindinfo, #signupinfo").hide('slow'); 

     }); 
    }); 
    }); 
</script> 




<script type="text/javascript"> 
$(document).ready(function() { 
    jQuery(function(){ 
     jQuery("#behind").click(function() { 
     jQuery("#behindinfo").slideToggle('slow'); 
     jQuery("#fpinfo, #musicinfo, #signupinfo").hide('slow'); 

     }); 
    }); 
    }); 
</script> 

    <script type="text/javascript"> 
    $(document).ready(function() { 
    jQuery(function(){ 
     jQuery(".exit").click(function() { 
     jQuery("#behindinfo, #musicinfo, #fpinfo, #signupinfo").hide('slow'); 

     }); 
    }); 
    }); 
</script> 

<script type="text/javascript"> 
$(document).ready(function() { 
    jQuery(function(){ 
     jQuery("#signup").click(function() { 
     jQuery("#signupinfo").slideToggle('slow'); 
     jQuery("#fpinfo, #musicinfo, #behindinfo").hide('slow'); 

     }); 
    }); 
    }); 
</script> 

    <script type="text/javascript"> 
    $(document).ready(function() { 
    jQuery(function(){ 
     jQuery(".exit").click(function() { 
     jQuery("#behindinfo, #musicinfo, #fpinfo, #signupinfo").hide('slow'); 

     }); 
    }); 
    }); 
</script> 



<script> 
    $('#behind, #fproduct, #music, #signup').click(function(){ 
     var divLoc = $('#top').offset(); 
     $('html, body').animate({scrollTop: divLoc.top}, "slow"); 
    }); 
</script> 

Answer 1

Нечто подобное:

<script type="text/javascript"> 
$(document).ready(function() { 

     jQuery("#music").click(function() { 
     jQuery("#musicinfo").slideToggle('slow'); 
     jQuery("#fpinfo, #behindinfo, #behindinfo, #signupinfo").hide('slow'); 

     }); 


     jQuery("#fproduct").click(function() { 
     jQuery("#fpinfo").slideToggle('slow'); 
     jQuery("#musicinfo, #behindinfo, #behindinfo, #signupinfo").hide('slow'); 

     }); 

     jQuery("#behind").click(function() { 
     jQuery("#behindinfo").slideToggle('slow'); 
     jQuery("#fpinfo, #musicinfo, #signupinfo").hide('slow'); 

     }); 

     jQuery(".exit").click(function() { 
     jQuery("#behindinfo, #musicinfo, #fpinfo, #signupinfo").hide('slow'); 

     }); 

     jQuery("#signup").click(function() { 
     jQuery("#signupinfo").slideToggle('slow'); 
     jQuery("#fpinfo, #musicinfo, #behindinfo").hide('slow'); 

     }); 

     jQuery(".exit").click(function() { 
     jQuery("#behindinfo, #musicinfo, #fpinfo, #signupinfo").hide('slow'); 

     }); 

    $('#behind, #fproduct, #music, #signup').click(function(){ 
     var divLoc = $('#top').offset(); 
     $('html, body').animate({scrollTop: divLoc.top}, "slow"); 
    }); 
    }); 


</script> 

Answer 2

После объединения и последовательно используя знак $ для JQuery мы получаем что-то вроде этого:

<script type="text/javascript"> 
$(document).ready(function() { 

    $("#music").click(function() { 
      $("#musicinfo").slideToggle('slow'); 
      $("#fpinfo, #behindinfo, #behindinfo, #signupinfo").hide('slow'); 
      }); 
    $("#behind").click(function() { 
     $("#behindinfo").slideToggle('slow'); 
     $("#fpinfo, #musicinfo, #signupinfo").hide('slow'); 
      }); 
    $("#fproduct").click(function() { 
     $("#fpinfo").slideToggle('slow'); 
     $("#musicinfo, #behindinfo, #behindinfo, #signupinfo").hide('slow'); 
      }); 
    $(".exit").click(function() { 
     $("#behindinfo, #musicinfo, #fpinfo, #signupinfo").hide('slow'); 
      }); 
    $("#signup").click(function() { 
     $("#signupinfo").slideToggle('slow'); 
     $("#fpinfo, #musicinfo, #behindinfo").hide('slow'); 

      }); 
     $(".exit").click(function() { 
     $("#behindinfo, #musicinfo, #fpinfo, #signupinfo").hide('slow'); 

     }); 

    $('#behind, #fproduct, #music, #signup').click(function(){ 
     var divLoc = $('#top').offset(); 
     $('html, body').animate({scrollTop: divLoc.top}, "slow"); 
    }); 
}); 
</script>