Lien dans menu déroulant ne fonctionne pas avec le clic gauche

**flappy06** · 02/09/2014, 23h13

Bonjour,

Vous le constaterez vite, je suis débutant.

J'essaie de faire un menu déroulant avec des liens. J'ai récupéré un menu déroulant tout fait que j'ai ensuite modifié. J'ai ensuite inséré les liens.

Comme je le dis dans le sujet, rien ne se passe lorsque je clique gauche dessus. En revanche, lorsque je clique droit suivi de "ouvrir le lien dans une nouvelle fenêtre" ou "ouvrir le lien dans un nouvel onglet".

Voici le code :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
<!DOCTYPE html>
<html lang="fr">
  <head>
    <meta content="text/html; charset=utf-8" http-equiv="content-type">
    <title>Menu</title>
    <link rel="stylesheet" href="css/styles.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  </head>
  <body>
    <div id="content">
      <ul class="menu">
        <li class="item1"><a href="#">Accueil</a>
          <ul>
            <li class="subitem1"><a class="sublink" href="Accueil.htm">Page
                d'accueil</a></li>
            <li class="subitem2"><a class="sublink" href="#">Fonctionnement de
                la classe</a></li>
            <li class="subitem2"><a target="_blank" class="sublink" href="maths%20utiles.htm">Les
                maths, ça ne sert à rien</a></li>
          </ul>
        </li>
        <li class="item2"><a href="#">Secondes</a>
          <ul>
            <li class="subitem1"><a class="sublink" href="#">Secondes 10</a>
              <ul>
                <li class="subsubitem1"><a href="#">Cahier de texte</a></li>
                <li class="subsubitem2"><a target="_parent" href="lycee/2nde/Cours_seconde.htm">Cours</a></li>
                <li class="subsubitem3"><a href="#">Contrôles et corrigés</a></li>
              </ul>
            </li>
            <li class="subitem2"><a class="sublink" href="#">Secondes 11</a>
              <ul>
                <li class="subsubitem1"><a href="#">Cahier de texte</a></li>
                <li class="subsubitem2"><a href="#">Cours</a></li>
                <li class="subsubitem3"><a href="#">Contrôles et corrigés</a></li>
              </ul>
            </li>
          </ul>
        </li>
        <li class="item3"><a href="#">Premières</a>
          <ul>
            <li class="subitem1"><a class="sublink" href="#">Premières S</a>
              <ul>
                <li class="subsubitem1"><a href="#">Cahier de texte</a></li>
                <li class="subsubitem2"><a href="#">Cours</a></li>
                <li class="subsubitem3"><a href="#">Contrôles et corrigés</a></li>
              </ul>
            </li>
            <li class="subitem2"><a class="sublink" href="#">Premières STI2D</a>
              <ul>
                <li class="subsubitem1"><a href="#">Cahier de texte</a></li>
                <li class="subsubitem2"><a href="#">Cours</a></li>
                <li class="subsubitem3"><a href="#">Contrôles et corrigés</a></li>
              </ul>
            </li>
          </ul>
        </li>
        <li class="item4"><a href="#">Terminales</a>
          <ul>
            <li class="subitem1"><a class="sublink" href="#">Terminale S
                (spécialité)</a>
              <ul>
                <li class="subsubitem1"><a href="#">Cahier de texte</a></li>
                <li class="subsubitem2"><a href="#">Cours</a></li>
                <li class="subsubitem3"><a href="#">Contrôles et corrigés</a></li>
              </ul>
            </li>
            <li class="subitem2"><a class="sublink" href="#">Terminales STI2D</a>
              <ul>
                <li class="subsubitem1"><a href="#">Cahier de texte</a></li>
                <li class="subsubitem2"><a href="#">Cours</a></li>
                <li class="subsubitem3"><a href="#">Contrôles et corrigés</a></li>
              </ul>
            </li>
            <li class="subitem3"><a class="sublink" href="#">Terminales STMG</a>
              <ul>
                <li class="subsubitem1"><a href="#">Cahier de texte</a></li>
                <li class="subsubitem2"><a href="#">Cours</a></li>
                <li class="subsubitem3"><a href="#">Contrôles et corrigés</a></li>
              </ul>
            </li>
          </ul>
        </li>
        <li class="item5"><a href="#">Contact</a> </li>
        <li class="item6"><a href="#">Liens</a> </li>
      </ul>
    </div>
    <!--initiate accordion-->
    <script type="text/javascript">

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
$(function() {
    var menu_ul = $('.menu li > ul'),
    menu_a  = $('.menu li > a');
    menu_ul.hide();
    menu_a.click(function(e) {
        e.preventDefault();
        if(!$(this).hasClass('active')) {
            if ($(this).closest("ul").hasClass("menu")){
        	menu_a.removeClass('active');
	       	menu_ul.filter(':visible').slideUp('normal');
            }else{
            	$(this).closest("ul").find("a").removeClass('active');
            	$(this).closest("ul").find("ul").filter(':visible').slideUp('normal');
            }
            $(this).addClass('active').next().stop(true,true).slideDown('normal');
        } else {
            $(this).removeClass('active');
            $(this).next().stop(true,true).slideUp('normal');
        }
    });
});

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
</script>
  </body>
</html>

Si je copie uniquement la partie avec le lien dans une page vierge, ça marche.

Quelqu'un sait-il d'où vient le problème ? J'espère avoir donné suffisamment d'information ... et avoir posté au bon endroit

Merci par avance.

**NoSmoking** · 06/09/2014, 16h34

Bonjour,
dans ton code on trouve

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
menu_a.click(function(e) {
    e.preventDefault();  // annule l'action par défaut

A lire event.preventDefault()

Lien dans menu déroulant ne fonctionne pas avec le clic gauche

jQuery

Discussions similaires

Partager

Partager