Déterminer quelle checkbox est cliquée

**missloo** · 04/07/2012, 14h46

bonjour
j'ai un ensemble de checkbox (element_7_1,element_7_2.... )auquel j'affecte les mêmes instructions à l'événement clic. seule nuance elle n'agissent pas sur le meme div mais sur (accordeon1,accordeon2..)
j'ai réussi à faire fonctionner mes instructions et j'aimerai n'avoir une seule commande pour l'ensemble de mes checkbox.
pour cela il faudra pouvoir savoir qu'elle checkbox est cliquer.
pourriez vous m'aider, car j'ai du mal avec la syntaxe jquery.

voici mon code:

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
 
  $('#element_7_1 ').click(function() { 
   if ($(this).is(':checked') == false) {
	$(".element_radio").attr('checked', false);
	$('#accordeon1').slideUp()
	}
   });
 
 
    $('#element_7_2 ').click(function() { 	
   if ($(this).is(':checked') == false) {
	$(".element_checkbox").attr('checked', false);
	$('#accordeon2').slideUp()
	}
   });

**SpaceFrog** · 04/07/2012, 15h02

$(this) est l'element cliqué

**Bovino** · 04/07/2012, 15h21

Pas tout à fait Spaffy

$(this) est l'élément qui a déclenché l'événement, l'élément cliqué, c'est $(e.target)

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
<!doctype html>
<html lang="fr">
<head>
	<meta charset="utf-8" />
	<title>Clic</title>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
	<script>
                jQuery(function($){
                        $('#outer').on('click', function(e){
                                var msg = 'Elément cliqué : <b>' + e.target.id + '</b>';
                                msg += '<br />This : <b>' + this.id + '</b>';
                                $('#result').html(msg);
                        });
                });
        </script>
	<style>
                #outer{
                        margin: 25px;
                        width: 600px;
                        height: 400px;
                        background-color: silver;
                }
                #inner{
                        width: 300px;
                        height: 200px;
                        background-color: gray;
                }
        </style>
</head>
<body>
	<div id="outer">
		<div id="inner"></div>
	</div>
	<div id="result"></div>
</body>
</html>