2013-07-24 10 views
10

Ho creato un modulo pulsante di base 2 come mostrato nell'esempio seguente.Pulsante radio "selezionato = controllato" non cambia quando l'opzione è cambiata

Osservando il rendering del browser, vediamo l'elemento 1 selezionato. Controlliamo gli articoli 1 e 2.

Quando faccio clic sull'elemento 2, mi aspetto che l'elemento 1 selezionato = selezionato sia rimosso. Mi aspetto che l'articolo 2 riceva l'attributo controllato = controllato.

Non è questo il comportamento previsto?

<div> 
    <span>Item 1</span> 
    <input type="radio" name="radio1" id="radio1" checked="checked" /> 
</div> 

<div> 
    <span>Item 2</span> 
    <input type="radio" name="radio1" class="checkbox" id="radio2" /> 
</div> 

http://jsfiddle.net/chrimbus/ZTE7R/1/

+0

@quentin e altri: Le risposte sono grandi, fa questo confermano poi che il comportamento atteso di un _attribute_ "controllato" non aggiornerà automaticamente **, senza l'utilizzo di Javascript ** – nthChild

+0

ho potuto? per modellare il pulsante di opzione "checked" e l'etichetta applicando gli stili usando uno pseudo-selettore: selezionato. Funziona con IE9 +, Chrome e Firefox. http://jsfiddle.net/sXjyL/4/ – nthChild

risposta

13

Il checkedattributo specifica il predefinita verificata pulsante di scelta, non attualmente controllati uno.

Vedere this example code. Fai clic sul secondo pulsante di opzione, quindi fai clic su Ripristina. Quindi fare nuovamente clic sul secondo pulsante di opzione, quindi su Interruttore, quindi su Ripristina.

La controllato proprietà darà il corrente stato selezionato di un pulsante di scelta.

Checked attribute vs checked property

+0

Aspettavo quella * proprietà * vs * attributo * distinzione :) – brbcoding

+0

@quentin Le tue risposte sono grandi, questo conferma che il comportamento previsto di un attributo "controllato" sarà non si aggiorna automaticamente senza l'uso di Javascript? – nthChild

+0

Sì. Solo JavaScript può modificare l'attributo * controllato * una volta caricata la pagina. – Quentin