384400/-readme.md

## -readme.md

      
    Raw
  

              -readme.md
            
          
    Comment identifier une deuxième classe associée à une première classe avec jQuery ?

Par exemple, nous voulons connaître la classe associée à la classe foo.
L'intérêt peut être multiple...
À titre d'illustration, nous générons une liste de choix avec Hypertext Preprocessor (Php) à partir de la saisie d'un utilisateur, qui est envoyée par Asynchronous JavaScript And Xml (Ajax). Nous voulons conserver un identifiant pour sécuriser la transaction suivante.
<?php
/* ... */
$_SESSION['nonce'] =  md5(rand(1000, 9));
/* ... */
$out .= "\t\t".'<input type="radio" class="add '.$_SESSION['nonce'].'" name="article" value="'.$article['code'].'" id="article-'.$count.'"><label for="article-'.$count.'">'.$data['article'].'</label>'. "\n";
/***/
?>
<script>
/***/
jQuery(document).on('click', '.add', function() {
/***/
var nonce = $('.add').attr('class').split(' ')[1];
/***/
var formSelectArticle  = 'article=' + article + '&nonce=' + nonce + '&action=' + actionSelectArticle;
});
/***/
</script>
Attention ! pour capturer la classe avec jQuery, nous recourons à la méthode .delegate() en utilisant jQuery(document).on('click', '.add', function() et pas à la méthode directe .on() en utilisant jQuery('.add').on('click', function() : en effet, ces éléments n'existent pas dans le Document Object Model (Dom) lors du chargement de la page dans le navigateur.
Voici une démonstration : JsFiddle.

  
## check-class.html
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Comment identifier une deuxième classe associée à une première classe avec jQuery ?</title>
<meta name="description" content="Comment connaître la deuxième classe associée à une première classe avec jQuery ?" />
</head>
<body>
<div class="foo bar">Foo, bar</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script>
jQuery(document).ready(function ($) {
  jQuery('.foo').on('click', function() {
    var targetClass = $('.foo').attr('class').split(' ')[1];
    alert(targetClass);
  });
});
</script>
</body>
</html>
	<!doctype html>
	<html>
	<head>
	<meta charset="utf-8" />
	<title>Comment identifier une deuxième classe associée à une première classe avec jQuery ?</title>
	<meta name="description" content="Comment connaître la deuxième classe associée à une première classe avec jQuery ?" />
	</head>
	<body>
	<div class="foo bar">Foo, bar</div>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
	<script>
	jQuery(document).ready(function ($) {
	jQuery('.foo').on('click', function() {
	var targetClass = $('.foo').attr('class').split(' ')[1];
	alert(targetClass);
	});
	});
	</script>
	</body>
	</html>