Impossible d'obtenir les onglets jquery imbriqués

Voici l'exemple de script complet qui illustre le problème. Les onglets internes de la société/du département apparaissent sous forme de liste au lieu d'onglets.Impossible d'obtenir les onglets jquery imbriqués

Edit: J'ai déjà essayé ce que les gens ont suggéré que les onglets internes devraient également être tabified via jQuery mais

il ne fonctionne pas
tous les exemples que je l'ai vu par exemple http://cse-mjmcl.cse.bris.ac.uk/blog/jQueryNestedMenus/nested.html Utilisez la div la plus haute pour l'appel des onglets jQuery.

code:

<html> 
<head> 
<link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.all.css" rel="stylesheet" /> 
<script type="text/javascript" src="http://jqueryui.com/latest/jquery-1.3.2.js"></script> 
<script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.core.js"></script> 
<script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.tabs.js"></script> 
<script type="text/javascript"> 
$(function(){ 
    //make tabs tabs 
    $('#top-tabs').tabs({selected: 2}); 
}); 
</script> 

</head><body> 

<div id="top-tabs"> 
    <ul> 
      <li><a href="/timeapp/home">Home</a></li> 
      <li><a href="/timeapp/timecard">Timecard</a></li> 
      <li><a href="#tab-selected">Config</a></li> 
    </ul> 

    <div id="tab-selected"> 
    <ul> 
       <li><a href="#inner-tab-selected">Company</a></li> 
       <li><a href="/timeapp/config/department">Department</a></li> 
    </ul> 
    <div id="inner-tab-selected">ok this is a company</div> 

    </div> 
</div> 

</body></html>

Source

2009-09-16 Anurag Uniyal

J'ai posté la question sur le forum jquery et got the answer.

La raison est que elem.tabs() doit être appelée sur tous les onglets internes, l'exemple que j'ai donné le fait en utilisant jQuery selector e.g. $('#container ul').tabs(), voici donc le script de travail modifié:

<html> 
<head> 
<link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.all.css" rel="stylesheet" /> 
<script type="text/javascript" src="http://jqueryui.com/latest/jquery-1.3.2.js"></script> 
<script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.core.js"></script> 
<script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.tabs.js"></script> 
<script type="text/javascript"> 
$(function(){ 
    //make tabs tabs 
    $('#top-tabs').tabs({selected: 2}); 
    $('#low-tabs').tabs({selected: 1}); 
}); 
</script> 

</head><body> 

<div id="top-tabs"> 
    <ul> 
      <li><a href="/timeapp/home">Home</a></li> 
      <li><a href="/timeapp/timecard">Timecard</a></li> 
      <li><a href="#tab-selected">Config</a></li> 
    </ul> 

    <div id="tab-selected"> 
    <div id="low-tabs"> 
    <ul> 
       <li><a href="#inner-tab-selected">Company</a></li> 
       <li><a href="/timeapp/config/department">Department</a></li> 
    </ul> 
    <div id="inner-tab-selected">ok this is a company</div> 
    </div> 
    </div> 
</div> 

</body></html>

Source

2009-09-18 11:16:25

Si ceci est votre dossier complet, le problème est, vous n'êtes pas dire ce que l'onglet « sélectionné » div est censé être onglets. Je n'ai pas testé, mais en ajoutant un:

$('#tab-selected').tabs();

ferait probablement l'affaire.

Source

2009-09-16 13:41:30 Patricia

+ 1 vous étiez plus proche, mais pas exact. –

Impossible d'obtenir les onglets jquery imbriqués

Répondre

Questions connexes