Discussion :

[sisiniya]

Bonjour,

Je souhaite déclencher un événement click (sur le lien ayant 'link' comme id) lorsqu'on clique sur la checkbox:

Code HTML:

Code html :

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

1
2
<input type="checkbox" name="choix" id="case">
<a href="www.google.com" id="link"> choix </a>

J'ai essayé en utilisant bind/trigger, mais aucun effet ne s'est produit quand je clique sur la checkbox !

Code JS:

Code :

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

1
2
3
$("#case").bind("click", function(){
	$("#link").trigger('click');
});

Pourriez-vous m'aiguiller vers la bonne solution ?

Par avance, Merci

Sisiniya.

[danielhagnoul]

Bonjour

Ne pas utiliser "link" qui est un mot réservé du langage HTML. Idem pour "case" mot réservé de JS.

Code :

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

1
2
<input type="checkbox" name="choix" id="cas">
<a href="www.google.com" id="lien"> choix </a>

Code :

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

1
2
3
4
5
6
7
8
$( "#lien" ).on( "click", function(){
    alert( "J'avais oublié le principal, définir une action sur l'événement click" );
    // return false; // pour stopper l'action par défaut
});
 
$( "#cas" ).on( "click", function(){
    $( "#lien" ).trigger( "click" );
});

[sisiniya]

Bonjour Daniel,

Merci beaucoup pour votre réponse.

Au fait, quand je clique sur la case à cocher, l'alerte associée au lien s'affiche très bien mais mon problème c'est que la redirection vers www.google.com, autrement, l'effet href d'un lien ne se déclenche pas !!

Avez-vous une idée s'il vous plaît ?


Sisiniya.

[danielhagnoul]

L'attribut "href" a besoin d'une URL complète : <a href="http://www.google.com" id="lien"> choix </a>.

[sisiniya]

Avec ceci, j'arrive bien à déclencher l'événement click (affichage d'alerte) sur le lien mais aucun effet sur href !

Pour s'assurer que le href est juste, quand je clique sur le lien (<a>), il me redirige bien vers l'URL.

Est ce que la simulation d'un événement sur un lien ne permet pas de déclencher l'effet de son attribut href ?

Par avance, Merci.

Sisiniya.

[danielhagnoul]

Je n'y comprends plus rien, si vous nous montriez vos codes (CSS, HTML, JS) afin que l'on puisse tester le problème, plutôt que de nous dire "cela ne fonctionne pas" ce qui ne nous aide pas du tout à comprendre le problème.

[sisiniya]

Bonjour Daniel,

Désolé si je n'étais pas claire...

Code HTML:

Code html :

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

1
2
<input type="checkbox" name="choix" id="cas">
<a href="http://www.google.com" id="lien"> choix </a>

Code JavaScript:

Code :

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

1
2
3
4
5
6
7
8
$("#lien").click(function(){
	alert('Appel au lien = ' + $("#lien").attr('href'));
});
 
$("#cas").click(function(){
        $("#lien").trigger("click");
	alert('Afficher Lien = ' + $("#lien").attr('href'));
});

1. Quand je clique sur le lien (choix), l'alerte (Appel au lien...) s'affiche + redirection vers site google.com.

2. Quand je clique sur la case (cas), l'alerte (Appel au lien...) et (Afficher Lien...) s'affichent mais aucune redirection vers le site google.com !! C'était ça mon soucis.

Dans tous les cas la valeur de $("#lien").attr('href') est toujours http://www.google.com

Espérant que j'étais plus précise qu'avant.

PS: j'ai testé sur les browsers: Chrome, Firefox, IE

Merci pour votre aide Daniel.

Sisiniya.

[NoSmoking]

Bonjour,
pourquoi ne pas faire directement un

Code :

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

1
2
3
$("#cas").on('click', function(){
   window.location = $("#lien").attr('href');
});

[sisiniya]

Merci NoSmoking pour votre réponse.

En effet, ce que vous avez proposez permet la redirection vers url de l'attribut href.

Par contre, j'ai besoin que cela marche aussi avec la simulation du click en utilisant les triggers.

Pourquoi compliquer la vie avec cette simulation ?!!
En réalité mon href contient une action (showFile.do) vers un contrôleur.
Mon objectif d'origine: quand je clique sur le lien ou la case à cocher, il faut afficher une fenêtre proposant l'ouverture ou l'enregistrement du fichier. (cf. mon poste sur le site ayant comme titre 'Dialogue Open/Save File')

Ce contrôleur renvoie la réponse (HttpServletReponse) alimentée par les bonnes données (header, contentType, fichier à afficher...) permettant d'afficher cette fenêtre qui propose l'ouverture/enregistrement du fichier.

Si j'utilise window.location, le fichier sera ouvert dans une fenêtre et ce n'est pas mon objectif. D'où, l'idée de simuler le click.

Pourriez-vous me dire si j'ai loupé un truc dans mon code ?

Sisiniya.

[danielhagnoul]

Bonsoir

J'étais persuadé que l'action par défaut d'un élément du DOM était activée par un trigger( "click" ), mais on dirait bien que ce n'est plus toujours le cas depuis longtemps pour des raisons de sécurité (?).

La méthode trigger() souffre aussi de bogues récurrents depuis longtemps.

Il y a beaucoup de littérature sur le sujet aussi bien dans les tickets jQuery (rapport de bogues) que sur les forums anglophones, la meilleure explication que j'aie vue est : http://stackoverflow.com/questions/1...694803#1694803

Code :

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

1
2
3
4
5
6
7
8
9
10
11
// ne fonctionne pas
//$( "#lienID" ).trigger( "click" );
 
// fonctionne
window.location.href = $( "#lienID" ).prop( "href" );
 
// fonctionne !
$( "#lienID" )[ 0 ].click();
 
// fonctionne !!!
$( "#lienID" )[ 0 ].trigger( "click" );