为单选按钮分配一个初始值

如何分配单选按钮的值,最初在 HTML 中检查?

212428 次浏览

您可以为此使用 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"

这使得“第二”单选按钮在加载页面时被选中。

在单选按钮上设置默认选中的另一种方法,特别是在使用 angularjs 时,是将‘ ng-check’标志设置为“ true” 例句: <input id="d_man" value="M" ng-disabled="some Value" type="radio" ng-checked="true">Man

检查 = “检查”对我不起作用. 。

对于任何寻找 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属性(钥匙)的存在,忽略了它的值,因此将检查组中的最后一个输入。

请注意,如果您有两个单选按钮具有相同的“ name”属性,并且它们具有“义务”属性,那么向它们添加“ check”属性将不会使它们被选中。

示例: 这会使两个单选按钮保持未选中。

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

我有点晚了党和我知道 OP 说的 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 存储中的数据,那么可以按照下面的方式设置“ check”选项。

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

对我有效的方法是,为单选按钮分配与包含表单标记相同的 姓名属性,为默认按钮分配 勾选 = “勾选”属性,如下所示:

<form name="State" method="get" action="">
<input type="radio" name="State" id="" value="" />
<input type="radio" name="State" id="" value=""checked="checked"/>
<input type="radio" name="State" id="" value="" />
<input type="radio" name="State" id="" value="" />
</form>

在上面的示例中,加载页面时将选中第二个单选按钮。

如果不对所有单选按钮应用空值,那么初始的“勾选”属性只能起作用:

<form>
<input type="radio" name="myRadioGroup" value="1" >
<input type="radio" name="myRadioGroup" value="2" checked >
<input type="radio" name="myRadioGroup" value="3" >
<input type="radio" name="myRadioGroup" value="4" >
</form>

不要问我为什么。但这解决了问题。