Passer une variable pour déclencher le masquage/affichage des panneaux

Question

J'ai une configuration de masquage/affichage de panneau qui est déclenchée à partir d'une ancre d'élément de liste. Fonctionne très bien. Le problème est, j'ai aussi un menu déroulant dans la navigation du site qui doit également déclencher chaque panneau, à partir de n'importe quelle page sur le site. Comme dire, j'ai des panneaux (dans cet ordre), "Matériel", "Logiciel", "Accessoires" sur la page Produits. Donc, quand je suis sur la page À propos de, et que je clique sur "Logiciel", le résultat attendu est de m'amener à la page Produits et d'ouvrir le panneau "Logiciel". Voici mon script jquery pour le panneau:

$("ul#product-type li a").click(function() { 
$("ul#product-type li").removeClass("selected"); 
$(this).parent().addClass("selected"); 
var currentTab = $(this).attr("href"); 
    $("div.panel").hide(); 
    $(currentTab).show(); 
return false; }); 

Nav Markup Dropdown:

<ul id="nav"> 
<li><a href="/products/#hardware"><span>Hardware</span></a></li> 
<li><a href="/products/#software"><span>Software</span></a></li> 
<li><a href="/products/#accessories"><span>accessories</span></a></li> 

J'ai essayé d'ajouter le sélecteur de navigation à la fonction de clic, mais cela ne fonctionne pas. Toute idée ou suggestion serait grandement appréciée.

Cheers, Ryan

Answer 1

Le href n'est pas un sélecteur valide, car $("/products/#hardware") ne fonctionnerait pas. Cependant, l'utilisation de la propriété .hash est parfaite, car vous obtiendrez $("#hardware"). Utilisez-le comme ceci:

$("ul#product-type li a").click(function() { 
    $("ul#product-type li").removeClass("selected"); 
    $(this).parent().addClass("selected"); 
    $("div.panel").hide(); 
    $(this.hash).show(); 
    return false; 
});