Je veux appliquer une seule et même fonction plusieurs fois sur une page, à chaque fois aux éléments avec leur propre identifiant (pour afficher et masquer des éléments). Lorsque j'applique la fonction sans spécifier des identifiants, tous les éléments du document changeraient. Ainsi, je dois spécifier la fonction plusieurs fois dans le fichier JavaScript, chacune avec son propre identifiant, ou est-il possible d'obtenir l'identifiant en quelque sorte au moment de l'exécution?
HTML STRY> P> function switchIt_stahlherstellung() {
if (document.getElementById('stahlherstellung')) {
if (document.getElementById('stahlherstellung').style.display == 'none') {
document.getElementById('stahlherstellung').style.display = 'block';
}
else {
document.getElementById('stahlherstellung').style.display = 'none';
}
}
}
function switchIt_produkte() {
if (document.getElementById('produkte')) {
if (document.getElementById('produkte').style.display == 'none') {
document.getElementById('produkte').style.display = 'block';
}
else {
document.getElementById('produkte').style.display = 'none';
}
}
}
3 Réponses :
Vous devez en savoir plus sur les fonctions et spécifiquement paramètres em>. Par exemple: p> alors vous pouvez appeler cette seule fonction Comme: p> En savoir plus: https://Developer.mozilla.org/en-us/docs/web/javaScript/Guide/functions P> p> Switchit_stahlherstellung ('einheiten_stahlherstellung'); code> p>
D'accord, merci. Cela me montre la direction pour continuer à regarder.
J'ai par la suite accepté la réponse de Mister Jojo, car elle a donné une solution concrète à mon problème.
Solution de mélange CSS / JS simple:
p>
<button class="switcher">switch</button> <div id="stahlherstellung"> show/hide stuff </div> <button class="switcher">switch</button> <div id="produkte"> show/hide stuff </div>
Oui, cela fonctionne et est une solution simple et mince. À Jsfiddle, je peux le reproduire, dans Firefox / Chrome, il est probablement dû à mes paramètres locaux. Par conséquent, j'ai accepté cette réponse.
@Pjoern Je pense que vous devez ajouter un différer code> sur votre balise de script ou utiliser
DomContentOached code> .or Placez votre script sous l'ensemble du corps HTML (souvent choisi)
Maintenant ça marche. Je mets le script à la fin du corps.
Il existe un moyen plus facile de faire votre travail sans toutes ces "ifs" et sans interroger et cartographier tous vos boutons. Dans votre HTML à "OnClick" à l'appel de votre fonction, vous passez en argument l'identifiant de la plongée que vous souhaitez afficher ou masquer. À votre div ajoute deux "classe" une pour gérer l'affichage et l'autre pour styler votre div.
html strong> p> un peu CSS par exemple. p> et la fonction. p> Vous obtenez l'argument transmis à L'appel de la fonction qui vous permet de sélectionner votre DIV par son "ID" et d'ajouter un "toogle" sur la classe masquée. p> JavaScript strong> p> function switchIt(id) {
document.getElementById(id).classList.toggle("hidden");
}
Où mettez-vous tous les
bouton> code> fin de fin? Cela peut être un problème
@Misterjojo tu as raison, c'est une erreur dans mon code, je vais le changer