aide combinant jquery fonctions dans un fichier

Question

J'essaie de combiner quelques fonctions sur un seul fichier js. Je suis très nouveau à jquery, en ce moment j'ai les fonctions qui travaillent sur des fichiers séparés, étant appelé sur diferent pages (travaillant sur Drupal), mais les chaînes sont si petites que je pense qu'il serait préférable de les combiner tous dans le fichier script.js.

Voici les fonctions:

$(document).ready(function() { 
    switches = $('#na-paises-list > li'); 
    slides = $('#na-paises-images > div'); 
    switches.each(function(idx) { 
      this.slide = slides[idx]; 
     }).click(function(){$(this).addClass('selected'); $(this.slide).unbind();}).hoverIntent(paisesOver,paisesOut); 
}); 

function paisesOver(){ $(this).addClass('active'); $(this.slide).fadeIn(); } 
function paisesOut(){ switches.removeClass('active'); slides.fadeOut('fast'); } 

(ce que j'ai trouvé sur un débordement de pile here et a changé un peu, cela est peut-être où je l'ai fait une erreur ...)

le second:

$(document).ready(function() { 
    $("#na-areas-actividade div").tabs({ fx: { opacity: 'toggle', duration: 'fast' }, cookie: { expires: 30 } }); 
}); 

Et le troisième:

$(document).ready(function() { 
    $("#agencias div").tabs({ fx: { opacity: 'toggle', duration: 'fast' }, cookie: { expires: 30 } }); 
}); 

Chaque fois que j'essaie de combiner la deuxième ou la troisième fonction avec la première, quelque chose ne va pas et un seul fonctionne. Et je place les fonctions à l'intérieur du document fonction prêt comme ceci:

$(document).ready(function() { 
    switches = $('#na-paises-list > li'); 
    slides = $('#na-paises-images > div'); 
    switches.each(function(idx) { 
      this.slide = slides[idx]; 
     }).click(function(){$(this).addClass('selected'); $(this.slide).unbind();}).hoverIntent(paisesOver,paisesOut); 

$("#na-areas-actividade div").tabs({ fx: { opacity: 'toggle', duration: 'fast' }, cookie: { expires: 30 } }); 

$("#agencias div").tabs({ fx: { opacity: 'toggle', duration: 'fast' }, cookie: { expires: 30 } }); 

}); 

function paisesOver(){ $(this).addClass('active'); $(this.slide).fadeIn(); } 
function paisesOut(){ switches.removeClass('active'); slides.fadeOut('fast'); } 

Toute aide ou pointeur dans la bonne direction pour plus d'informations sur ce problème est la bienvenue.

Answer 1

J'ai réussi à faire fonctionner votre code correctement (presque) non modifié. Un couple de choses.

1. hoverIntent n'est pas une méthode jQuery ou un gestionnaire d'événements. J'ai changé cela pour hover.
2. Assurez-vous de lier le plugin cookie jQuery si vous souhaitez utiliser l'option cookie sur le widget onglets. Je ne voulais pas aller chercher le plugin, alors j'ai juste enlevé l'option.

---

$(document).ready(function() { 

    switches = $('#na-paises-list > li'); 
    slides = $('#na-paises-images > div'); 

    switches.each(function(idx) { 
     this.slide = slides[idx]; 
    }).click(function(){ 
     $(this).addClass('selected'); 
     $(this.slide).unbind(); 
    }).hover(paisesOver,paisesOut); 

    $("#na-areas-actividade div").tabs({ 
     fx: { 
      opacity: 'toggle', 
      duration: 'fast' 
     }}); 

    $("#agencias div").tabs({ 
     fx: { 
      opacity: 'toggle', 
      duration: 'fast' 
     }});  
}); 

function paisesOver() { 
    $(this).addClass('active'); 
    $(this.slide).fadeIn(); 
} 

function paisesOut() { 
    switches.removeClass('active'); 
    slides.fadeOut('fast'); 
}