Присвойте начальное значение переключателю, как отмечено

Как назначить значение переключателя изначально, как проверено в HTML?

Вы можете использовать checkedатрибут для этого:

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

Вы можете просто использовать:

<input type="radio" checked />

Использование только проверенного атрибута без указания значения аналогично checked="checked".

Я поставил этот ответ на похожий вопрос, который был отмечен как дубликат этого вопроса. Ответ помог приличному количеству людей, поэтому я решил добавить его и на всякий случай.

Это не совсем ответ на вопрос, но для тех, кто использует AngularJS, пытаясь достичь этого, ответ немного отличается. И на самом деле нормальный ответ не сработает (по крайней мере, для меня).

Ваш HTML будет выглядеть очень похоже на обычную кнопку-переключатель:

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

В вашем контроллере вы объявили, mValueчто связано с переключателями. Чтобы предварительно выбрать один из этих переключателей, присвойте $scopeпеременной, связанной с группой, значение требуемого входа:

$scope.mValue="second"

Это делает «второй» переключатель выбранным при загрузке страницы.

Для тех, кто ищет решение для Angular2 (2.4.8), так как этот вопрос обычно используется при поиске:

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

Это добавит checkedатрибут к входу с учетом условия, но ничего не добавит, если условие не выполнится.

Не делай этого:

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

потому что это добавит атрибут checked="false"ко всем другим элементам ввода.

Поскольку браузер только ищет наличие checkedатрибута ( ключа ), игнорируя его значение, поэтому будет проверяться последний вход в группу.

Другой способ установить флажок по умолчанию для переключателей, особенно если вы используете angularjs, это установить флаг 'ng-checked' в 'true', например: <input id="d_man" value="M" ng-disabled="some Value" type="radio" ng-checked="true">Man

проверено = "проверено" не работает для меня ..

Обратите внимание, что если у вас есть две переключателя с одинаковым атрибутом «name» и они имеют атрибут «required», то добавление к ним атрибута «checked» не сделает их проверенными.

Пример: это делает оба переключателя неактивными.

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

Это заставит переключатель «мужской» проверяться.

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

Я немного опоздал на вечеринку, и я знаю, что ОП сказал html, но если вам нужно было сделать это в MVC, вы можете установить trueтретий параметр.

например:

    <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

Если для вашего приложения вы используете response-redux и если вы хотите показать данные, которые находятся в хранилище redux, вы можете установить опцию «флажок», как показано ниже.

<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"}
 />