Sélection du bouton radio

Je souhaite afficher quelques champs de texte en cliquant sur un bouton radio, comment puis-je le faire? sans JavaScript ni AJAX.Sélection du bouton radio

Source

2009-12-30 sarah

Vous devez utiliser JavaScript pour ceci.

Source

2009-12-30 05:16:48

il is'nt tout autre aller? – sarah

Non, j'ai peur. BTW, pourquoi vous vous limitez? Est-ce que c'est un peu un travail de défi? –

Je fais une application mobile où dans je ne devrais pas utiliser le script Java – sarah

La seule autre chose en dehors de JavaScript que pourrait travailler (je ne l'ai pas essayé mais c'est quelque chose à enquêter) est d'utiliser le :focus pseudo class en CSS. Même si cela fonctionne, il ne s'agira probablement pas d'un navigateur croisé, mais comme vous ciblez des plates-formes mobiles spécifiques, cela pourrait être OK. Il fonctionnerait comme ceci:

<style> 
    #bar { display:none; } 
    #foo:selected #bar { display:block; }   
</style> 

<input type="radio" id="foo"> 
<label for="foo"><div id="bar">Stuff goes here</div></label>

Je ne sais pas si: focus applique également à une étiquette de l'élément de forme associée, mais il peut certainement considérer que cliquer sur l'étiquette d'un élément n'active l'événement « click » sur le formulaire élément c'est l'étiquetage.

Quelque chose à essayer de toute façon. Si vous ciblez Safari mobile, vous devez avoir un bon support pour ce type de sélecteurs.

Source

2009-12-30 05:46:24 jpsimons

Pourquoi ne pas essayer '#foo: focus + label {display: block; } ' –

Je ne suis pas capable de reproduire le même.J'ai un bouton radio sur sélectionnez je devrais montrer un champ de texte. – sarah

Oui, pouvez-vous le faire avec un sélecteur de classe psudo, mais il ne fonctionnera certainement pas avec un autre navigateur. Vous pouvez vérifier:

http://www.quirksmode.org/css/contents.html

pour une liste de ce que visionneur quels sélecteurs. IE 7 et inférieur ne prennent pas en charge le sélecteur: focus, bien que vous puissiez accomplir à peu près ce que vous voulez avec: hover (bien que j'imagine que vous ne voulez pas le montrer uniquement en stationnaire).

L'exemple suivant fonctionne dans Firefox (3.5):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> 
<html lang="en"> 
<head> 
<style> 
input { float: left; } 

/* Make the text hidden when the page loads */ 
.text_to_show { display:none; } 

/* This style affects element which immediately follows the focused class */  
.trigger:focus + div.text_to_show { display: inline; }  

</style> 
</head> 
<body> 

<input type="radio" name="radio" class="trigger" /> 
<div class="text_to_show">This text is tied to the first radio button.</div> 

<input type="radio" name="radio" class="trigger" /> 
<div class="text_to_show">This text is tied to the 2nd radio button</div> 


</body> 
</html>

Source

2009-12-30 09:32:36 Erik

Sélection du bouton radio

Répondre

Questions connexes