html – 如何使用中间选项使检查的属性工作？

2023年9月24日 214次阅读

我有一套日,月和年的单选按钮.

<label>
   <input type="radio" ng-model="IsDays" name="timeunit" > Period in days
   <input type="radio" ng-model="IsMonths" ng-checked="true" name="timeunit"> Period in months
   <input type="radio" ng-model="IsYears" name="timeunit" > Period in years
</label>

我已经读过,尽管将checked属性放在中间选项中,但如果单选按钮具有相同的名称属性值,则将检查组中的最后一个按钮.

我用checked和ng-checked =“true”方案尝试了这个.

是否有一种简单的方法可以覆盖此行为并允许默认情况下检查中间选项(月份)？

更新：解决了我自己的问题.请参阅下面的答案.

最佳答案 发布答案以供将来参考：

只有在默认情况下需要检查最后一个单选按钮选项时,只需选中该选项即可.

我们需要给check =“checked”这个用于中间选项.刚检查在这种情况下不起作用.

<label>
 <input type="radio" ng-model="IsDays" name="timeunit" > Period in days
 <input type="radio" ng-model="IsMonths" checked="checked" name="timeunit"> Period in months
 <input type="radio" ng-model="IsYears" name="timeunit" > Period in years

奇怪:)

更新：清除浏览器cookie后,即使这样也无效.在查看一些AngularJS文档后,我得到了以下解决方案.

        <label>
            <input type="radio" ng-model="timeunit" value="days">
            Period in days
        </label><br />
        <label>
            <input type="radio" ng-model="timeunit" value="months">
            Period in months
        </label><br />
        <label>
            <input type="radio" ng-model="timeunit" value="years">
            Period in years
        </label><br />

我们必须为所有三个单选按钮的ng-model设置相同的值,而不是设置相同的名称属性,以使它们作为一个组运行.

要设置默认值,我们可以在js文件中设置它,如下所示

 function ($scope) {

    $scope.timeunit = "months"; //Default set to months

  //Other code
 }
点赞