11
votes

Vérifiez le bouton radio pour cliquer sur DIV

J'écris une application quiz en utilisant php / jQuery. Les sélections de réponse sont contenues comme suit: xxx

après avoir été styled w / css, ces réponses apparaissent dans un conteneur avec une réponse par ligne. Chaque réponse a sa propre boîte à l'intérieur du conteneur. Je souhaite que l'utilisateur puisse cliquer n'importe où à l'intérieur de la réponse individuelle DIV et que la radio sélectionne est cochée.

Comment puis-je activer le bouton radio Vérifiez lorsqu'un utilisateur clique sur le conteneur de la radio, en utilisant jquery?


1 commentaires

4 Réponses :


25
votes

Au lieu d'utiliser JQuery, cela peut tous être effectué dans HTML natif à l'aide du élément. Voici un exemple de celui-ci en action.

<ul id="answers"> 
        <li> 
                <label> 
                    <input type='radio' name='answer_id' value='313'> True
                </label> 
        </li> 
        <li> 
                <label> 
                    <input type='radio' name='answer_id' value='314'> False
                </label> 
        </li> 
</ul>


0 commentaires

0
votes

Peut-être quelque chose comme: xxx


0 commentaires

2
votes

L'utilisation correcte de la balise étiquette est la suivante: xxx

pour = "..." fait toujours référence à l'ID de l'entrée.


0 commentaires

2
votes

Je suis d'accord avec TJ111, mais si cela ne convient pas toujours:

  • plus difficile à style.
  • étiquettes travail que s'il y a du texte dans les (merci Michael)

    Voici le code alternatif utilisant div et jQuery: xxx

    avec la classe "active" maintenant, vous pouvez même masquer les radios et utiliser la feuille de style pour la surbrillance .


2 commentaires

C'est intéressant. Pourquoi pas: $ (entrée: radio '). Cliquez sur (Fonction (EV) {Ev.StopPropagation ();}). Parent (). Cliquez sur (Fonction (EV) {EV.PREventDefault (); $ (Ceci). enfants ("entrée"). Cliquez sur ();});


J'ai trouvé que les étiquettes ne fonctionnaient que lorsqu'il y avait du texte (ou une quantité importante de blancheurs) disponible pour avoir cliqué sur. Inversement, mettre le clic sur le parent bousillerait le clic radiophonique réel lui-même. Retravailler le code de Romaninsh résolu mon problème