Très nouveau à JavaScript, mais toute aide pour me faire démarrer serait appréciée. J'ai une forme simple: Je veux la case "Fris" grisaée à moins que le bouton radio "Burger" est sélectionné. Je ne sais pas si JavaScript ou CSS est le meilleur moyen de le faire. Merci d'avance!
7 Réponses :
Si vous utilisez jQuery , une bibliothèque JavaScript vraiment facile à utiliser (que je recommanderais fortement pour Débutants), vous pouvez le faire en deux étapes en ajoutant du code à une balise de script dans votre page contenant: Ce code fait trois choses:
modifier événements sur #burger .
fournie .
désactivé de #fries dans la propriété cochée de #burger .
Ce que vous voulez faire est de définir les éléments désactivés jusqu'à ce que l'état de la radio change, ce qui soit effectué avec JavaScript, puis vous ajouteriez / supprimé la classe désactivée dans l'ondanisation du bouton radio. < P> Quelles bibliothèques JavaScript envisagez-vous d'utiliser? JQuery rendrait cela assez simple.
Utilisez jQuery
Utilisation de jQuery: http://jsfiddle.net/kboucher/cmcp5/ (Ajout également des étiquettes à vos étiquettes)
J'ai remarqué que vous ne spécifiez pas si vous pouvez utiliser ou non JQuery. Si c'est une option, veuillez consulter l'un des autres postes que je le recommande vivement.
Si vous ne pouvez pas utiliser JQuery, essayez ce qui suit: exemple simple sur jsfiddle
Merci, c'est exactement ce dont j'avais besoin! Je semble apprendre à mieux choisir le code de travail.
Vous devriez répondre à JQuery pour ceux d'entre nous l'utilisant aussi.
@Kolobcanyon Il y a d'autres réponses ici qui montrent des fonctionnalités similaires à l'aide de JQuery. Compte tenu de l'OP spécifiquement demandé une solution JavaScript, cette réponse est adéquate. Je serais plus qu'heureux de vous aider à faire cela à JQuery si vous avez des problèmes. Je vais admettre - en regardant en arrière à cela, je n'utiliserais pas de gestionnaires d'événements en ligne. L'idée est la même chose, mais veuillez utiliser une liaison / délégation d'événement si vous faites cela ...
En fait avec un peu CSS3, vous pouvez vous maigrir une solution très simpliste. Ici, nous ne grisons pas le bouton, mais vous le rendez visibles uniquement si la case à cocher est cochée. Mais, nous pourrions également griser avec un peu plus de CSS sur cet exemple. Vous devrez toujours envisager le type de soutien que vous souhaitez offrir. Mais si vous voulez bien travailler sur les navigateurs modernes, donnez-lui simplement une go.
Voici le HTML P>
button { display: none}
:checked ~ button {
font-style: italic;
color: green;
display: inherit;
}
Mais je veux juste des frites. :(