Bonjour,
J'ai trouvé cette superbe méthode pour faire apparaître et disparaître des trucs en jQuery, qui va m'être d'une grande aide :
<!DOCTYPE html>
<head>
<script src="http://cdnjs.cloudflare.com/ajax/libs/headjs/0.99/head.min.js"></script>
<script>
head.js("http://code.jquery.com/jquery-2.0.0.min.js",
function(){
$( function(){
$("button", "#boutons").on("click", function(){
$( "div[id^='ID']" ).hide();
<!--Cacher toutes les DIV qui contiennent ID-->
$( "#ID" + $( this ).text() ).show();
<!--Montrer la DIV qui s'appelle ID plus (le texte dans le bouton)-->
});
});
}
);
</script>
</head>
<body>
<div id="boutons">
<button>111</button>
<button>112</button>
<button>113</button>
</div>
<div id="texte">
<div id="ID111">
<p>1.1.1</p>
</div>
<div id="ID112">
<p>1.1.2</p>
</div>
<div id="ID113">
<p>1.1.3</p>
</div>
</div>
</body>
</html>
Le problème : mes boutons seront des images. Je ne peux donc pas utiliser la partie ''$( "#ID" + $( this ).text() ).show();''.
Ma question : est-il possible d'utiliser une autre manière de faire référence à ces boutons, comme par exemple avec l'attribut Name ou l'attribut Id (qui, d'après mes essais, ne fonctionnent pas)?
J'ai essayé en appliquant des names à mes boutons et en changant la ligne :
$( "#ID" + $( this ).text() ).show();
pour :
$( "#ID" + $( this ).name() ).show();
mais ça ne fonctionnait pas. Une idée?