如何为单选按钮制作标签

时间:2015-06-12 09:36:25

标签: html css html5 c#-4.0 razorengine

我有一些单选按钮。但我也希望文字可点击。这样就选择了比率按钮。因此,不仅如果单击单选按钮选择了比率选项,而且如果单击文本,则选择比率按钮。

我有这个:

<td>
  <input id="upload" name="folder" type="radio" value="@item" />
  <label>@Html.Label(item)</label>
</td>

谢谢

我这样试试:

<div class="form-group">
   <div class="col-md-offset-2 col-md-10">
        <table>
            @foreach (var item in Model.Directories)
            {
                <tr>
                    <td>
                        <input id="upload" name="folder" type="radio" value="@item" />
                        <label for="upload">@Html.Label(item)</label>
                    </td>
                </tr>
             }
        </table>
    </div>
</div>

我现在就这样:

 <div class="form-group">
                                <div class="col-md-offset-2 col-md-10">
                                    <table>
                                        @foreach (var item in Model.Directories)
                {
                                            <tr>
                                                <td>
                                                    <label>
                                                        <input type="radio" name="folder" value="@item" id="upload">
                                                        <label for="folder">@Html.Label(item)</label>
                                                    </label>
                                                </td>
                                            </tr>
                }
                                    </table>
                                </div>
                            </div>

但单选按钮位于foreach循环中,因此每个单选按钮的id都不同

我这样试试:

  <div class="form-group">
                                <div class="col-md-offset-2 col-md-10">
                                    <table>
                                        @foreach (var item in Model.Directories)
                {
                                          @for(var i=0; i < item.Count; i++){
                                            <tr>
                                                <td>


                                                        <fieldset>
                                                            <input type="radio" name="folder" value="@item" id="folder">
                                                            <label for="folder">@Html.Label(item)</label>
                                                        </fieldset>

                                                </td>
                                            </tr>
                }
                                        }

                                    </table>
                                </div>
                            </div>

5 个答案:

答案 0 :(得分:3)

您可以将for属性与input&#39; s id属性的值一起使用:

&#13;
&#13;
<input id="upload" name="folder" type="radio" value="@item" />
<label for="upload">@Html.Label(item)</label>
&#13;
&#13;
&#13;

答案 1 :(得分:2)

简单的方法

&#13;
&#13;
    <td>
      <label>
      <input id="upload" name="folder" type="radio" value="@item" />
       @Html.Label(item)</label>
    </td>
&#13;
&#13;
&#13;

答案 2 :(得分:1)

使用<system.webServer> <security> <requestFiltering> <requestLimits maxAllowedContentLength="100000000" /> </requestFiltering> </security>

label for

答案 3 :(得分:0)

使用for属性:

<label for="folder">@Html.Label(item)</label>

答案 4 :(得分:0)

您需要将广播包含在标签内,要显示一些文字,请在标签内添加标签:

<label>
  <input type="radio" name="folder" value="@item" id="upload" >
  <span>@Html.Label(item)</span>
</label>