Assegna un valore iniziale al pulsante di opzione come selezionato

Come posso assegnare inizialmente il valore di un pulsante di opzione come verificato in HTML?

È possibile utilizzare l' checkedattributo per questo:

<input type="radio" checked="checked">

Puoi semplicemente usare:

<input type="radio" checked />

L'uso del solo attributo selezionato senza indicare un valore è lo stesso di checked="checked".

Ho inserito questa risposta su una domanda simile che è stata contrassegnata come duplicata di questa domanda. La risposta ha aiutato un discreto numero di persone, quindi ho pensato di aggiungerlo anche qui per ogni evenienza.

Questo non risponde esattamente alla domanda, ma per chiunque utilizzi AngularJS cercando di raggiungere questo obiettivo, la risposta è leggermente diversa. E in realtà la risposta normale non funzionerà (almeno non per me).

Il tuo html sarà abbastanza simile al normale pulsante di opzione:

<input type='radio' name='group' ng-model='mValue' value='first' />First
<input type='radio' name='group' ng-model='mValue' value='second' /> Second

Nel controller avrai dichiarato mValueche è associato ai pulsanti di opzione. Per avere uno di questi pulsanti di opzione preselezionato, assegnare la $scopevariabile associata al gruppo al valore dell'ingresso desiderato:

$scope.mValue="second"

Questo rende il "secondo" pulsante di opzione selezionato durante il caricamento della pagina.

Per chiunque cerchi una soluzione Angular2 (2.4.8), poiché questa è una domanda genericamente popolare durante la ricerca:

<div *ngFor="let choice of choices">
  <input type="radio" [checked]="choice == defaultChoice">
</div>

Questo aggiungerà il checked attributo all'input data la condizione, ma non aggiungerà nulla se la condizione fallisce.

Non farlo:

[attr.checked]="choice == defaultChoice"

perché questo aggiungerà l'attributo checked="false"ad ogni altro elemento di input.

Poiché il browser cerca solo la presenza checkeddell'attributo (la chiave ), ignorandone il valore, quindi verrà controllato l'ultimo input nel gruppo.

L'altro modo per impostare i pulsanti di opzione predefiniti selezionati, specialmente se si utilizza angularjs, è impostare il flag "ng-checked" su "true", ad esempio: <input id="d_man" value="M" ng-disabled="some Value" type="radio" ng-checked="true">Man

the checked = "checked" non ha funzionato per me ..

Nota che se hai due pulsanti di opzione con lo stesso attributo "nome" e hanno l'attributo "richiesto", l'aggiunta dell'attributo "controllato" non li farà controllare.

Esempio: in questo modo entrambi i pulsanti di opzione rimangono deselezionati.

<input type="radio" name="gender" value="male" required <?php echo "checked"; ?>/>
<input type="radio" name="gender" value="female" required />

Questo farà verificare il pulsante di opzione "maschio".

<input type="radio" name="gender" value="male" <?php echo "checked"; ?>/>
<input type="radio" name="gender" value="female" />

Sono un po 'in ritardo alla festa e so che l'OP ha detto HTML, ma se fosse necessario farlo in MVC, è possibile impostare trueil terzo parametro.

per esempio:

    <p>Option One :@Html.RadioButton("options", "option1", true})</p>
    // true will set it checked

     <p>Option Two :@Html.RadioButton("options", "option2"})</p>
     //nothing will leave it unchecked

Se si sta utilizzando la reattanza-redux per la propria applicazione e si desidera mostrare i dati presenti nell'archivio di redux, è possibile impostare l'opzione "selezionata" come di seguito.

<label>Male</label>

 <input
   type="radio"
   name="gender"
   defaultChecked={this.props.gender == "0"}
 />



 <label>Female</label>
 <input
   type="radio"
   name="gender"
   defaultChecked={this.props.gender == "1"}
 />