IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

jQuery Discussion :

Sélecteur, exclusion d'un tag HTML


Sujet :

jQuery

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre averti
    Profil pro
    Inscrit en
    Août 2009
    Messages
    43
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Août 2009
    Messages : 43
    Par défaut Sélecteur, exclusion d'un tag HTML
    Bonjour,

    Pour les besoins d'une application, je souhaiterais pouvoir exclure un tag HTML d'un sélecteur jQuery. Voici mon problème :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    <div id="maDiv">
    <a href="lien">Lien</a>
    </div>
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    $('#maDiv').click(function(){
            // Code
    });
    Actuellement, la fonction ci-dessus se déclenche lorsque je clique sur le lien contenu dans ma div, j'aimerais que ce ne soit pas le cas. Étant débutant en jQuery, je n'arrive pas à trouver de solution.

    Merci par avance pour votre aide.

  2. #2
    Rédacteur

    Avatar de danielhagnoul
    Homme Profil pro
    Étudiant perpétuel
    Inscrit en
    Février 2009
    Messages
    6 389
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant perpétuel
    Secteur : Enseignement

    Informations forums :
    Inscription : Février 2009
    Messages : 6 389
    Billets dans le blog
    125
    Par défaut
    Bonjour

    Exemple :
    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
    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
    <!doctype html>
    <html lang="fr">
    <head>
    	<meta http-equiv="X-UA-Compatible" content="chrome=1">
    	<meta charset="utf-8">
    	<meta name="Author" content="Daniel Hagnoul">
    	<title>Forum jQuery</title>
    	<style>
    		/* Base */
    		body { background-color:#dcdcdc; color:#000000; font-family:sans-serif; font-size:medium; font-style:normal;
    		font-weight:normal; line-height:normal; letter-spacing:normal; }
    		h1,h2,h3,h4,h5 { font-family:serif; }
    		div,p,h1,h2,h3,h4,h5,h6,ul,ol,dl,form,table,img { margin:0px; padding:0px; }
    		h1 { font-size:2em; text-shadow: 4px 4px 4px #bbbbbb; text-align:center; }
    		p { padding:6px; }
    		div#conteneur { width:95%; min-width:800px; min-height:500px; margin:12px auto; background-color:#FFFFFF;
    		color:#000000; border:1px solid #666666; }
     
    		/* Test */
    		#maDiv {
    			width:200px;
    			height:200px;
    			border:1px solid red;
    		}
    	</style>
    </head>
    <body>
    	<h1>Forum jQuery</h1>
    	<div id="conteneur">
     
    <div id="maDiv">
    	<a href="#">Lien</a>
    </div>
     
    	</div>
    	<script charset="utf-8" src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
    	<script>
    		$(function(){
     
    /*
     * Pour cliquer sur la division sans
     * propager l'évènement
     */
    $('#maDiv').click(function(){
        // Code
    	alert("clic sur maDiv");
     
    	return false;
    });
     
    /*
     * Pour pouvoir cliquer sur les liens
     * inclus dans la division
     */
    $("#maDiv a").click(function(){
        // Code
    	alert("clic sur a");
     
    	return false;
    });
     
    		});
     	</script>
    </body>  
    </html>

    Blog

    Sans l'analyse et la conception, la programmation est l'art d'ajouter des bogues à un fichier texte vide.
    (Louis Srygley : Without requirements or design, programming is the art of adding bugs to an empty text file.)

  3. #3
    Membre averti
    Profil pro
    Inscrit en
    Août 2009
    Messages
    43
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Août 2009
    Messages : 43
    Par défaut
    Effectivement, la première fonction ne se déclenche plus. En revanche, le lien n'est plus fonctionnel en retournant false.

    N'y a-t-il pas un moyen d'empêcher simplement le déclenchement de cette fonction en cliquant sur le lien, sans pour autant "casser" le lien ?

  4. #4
    Rédacteur

    Avatar de danielhagnoul
    Homme Profil pro
    Étudiant perpétuel
    Inscrit en
    Février 2009
    Messages
    6 389
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant perpétuel
    Secteur : Enseignement

    Informations forums :
    Inscription : Février 2009
    Messages : 6 389
    Billets dans le blog
    125
    Par défaut
    Bonsoir

    Si le lien doit rester fonctionnel, essayez sans le "return false;" ou la version suivante :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    $("#maDiv a").click(function(event){
    	event.stopPropagation(); // http://api.jquery.com/event.stopPropagation/
     
        // Code
    	alert("clic sur a");
    });

    Blog

    Sans l'analyse et la conception, la programmation est l'art d'ajouter des bogues à un fichier texte vide.
    (Louis Srygley : Without requirements or design, programming is the art of adding bugs to an empty text file.)

  5. #5
    Membre averti
    Profil pro
    Inscrit en
    Août 2009
    Messages
    43
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Août 2009
    Messages : 43
    Par défaut
    Je vous remercie pour votre aide, mais cette solution ne fonctionne pas non plus. La première méthode se déclenche toujours.

  6. #6
    Rédacteur

    Avatar de danielhagnoul
    Homme Profil pro
    Étudiant perpétuel
    Inscrit en
    Février 2009
    Messages
    6 389
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant perpétuel
    Secteur : Enseignement

    Informations forums :
    Inscription : Février 2009
    Messages : 6 389
    Billets dans le blog
    125
    Par défaut
    Cet exemple fonctionne-t-il convenablement chez vous ?

    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
    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
    <!doctype html>
    <html lang="fr">
    <head>
    	<meta http-equiv="X-UA-Compatible" content="chrome=1">
    	<meta charset="utf-8">
    	<meta name="Author" content="Daniel Hagnoul">
    	<title>Forum jQuery</title>
    	<style>
    		/* Base */
    		body { background-color:#dcdcdc; color:#000000; font-family:sans-serif; font-size:medium; font-style:normal;
    		font-weight:normal; line-height:normal; letter-spacing:normal; }
    		h1,h2,h3,h4,h5 { font-family:serif; }
    		div,p,h1,h2,h3,h4,h5,h6,ul,ol,dl,form,table,img { margin:0px; padding:0px; }
    		h1 { font-size:2em; text-shadow: 4px 4px 4px #bbbbbb; text-align:center; }
    		p { padding:6px; }
    		div#conteneur { width:95%; min-width:800px; min-height:500px; margin:12px auto; background-color:#FFFFFF;
    		color:#000000; border:1px solid #666666; }
     
    		/* Test */
    		#maDiv {
    			width:200px;
    			height:200px;
    			border:1px solid red;
    		}
    	</style>
    </head>
    <body>
    	<h1>Forum jQuery</h1>
    	<div id="conteneur">
     
    <div id="maDiv">
    	<a href="http://danielhagnoul.developpez.com/">Lien</a>
    </div>
     
    	</div>
    	<script charset="utf-8" src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
    	<script>
    		$(function(){
     
    /*
     * Pour cliquer sur la division sans
     * propager l'évènement
     */
    $('#maDiv').click(function(event){
    	event.stopPropagation();
     
        // Code
    	alert("clic sur maDiv");
    });
     
    /*
     * Pour pouvoir cliquer sur les liens
     * inclus dans la division
     */
    $("#maDiv a").click(function(event){
    	event.stopPropagation();
     
    	// Code
    	alert("clic sur a");
    });
     
    		});
     	</script>
    </body>  
    </html>

    Blog

    Sans l'analyse et la conception, la programmation est l'art d'ajouter des bogues à un fichier texte vide.
    (Louis Srygley : Without requirements or design, programming is the art of adding bugs to an empty text file.)

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. [DTD] Tags Html dans XML ---> Etendre la dtd du Xhtml
    Par tipaquo dans le forum Valider
    Réponses: 14
    Dernier message: 19/07/2010, 09h09
  2. [struts] tabindex dans un tag <html:radio>
    Par Milouse dans le forum Struts 1
    Réponses: 2
    Dernier message: 28/11/2005, 17h44
  3. utiliser un bean dans le tags html:link
    Par clement42 dans le forum Struts 1
    Réponses: 3
    Dernier message: 29/07/2005, 18h36
  4. [struts html tag] html:link associé à un event javascript
    Par VinceFromBcn dans le forum Struts 1
    Réponses: 2
    Dernier message: 16/03/2005, 11h59
  5. [STRUTS] utilisation de plusieurs tags <html:subm
    Par Super Castor dans le forum Struts 1
    Réponses: 6
    Dernier message: 23/06/2004, 11h42

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo