【问题标题】:Html.RadioButtonFor Radio Buttons aren't rendering in Safari nor ChromeHtml.RadioButtonFor 单选按钮不在 Safari 或 Chrome 中呈现
【发布时间】:2014-11-25 13:41:19
【问题描述】:

哎呀!我的单选按钮会在除 Safari 和 Google Chrome 之外的所有浏览器中呈现。

使用 ASP.NET MVC 4,我在我的一个观点中写了这个:

    <!-- model property1 -->
    <div class="form-group col-md-4">
        @Html.LabelFor(m => m.property1)
        <div class="form-control">
            @Html.RadioButtonFor(m => m.property1, true)
            @Html.Label("Yes")
            @Html.RadioButtonFor(m => m.property1, false)
            @Html.Label("No")
        </div>
    </div>

但它最终在页面上看起来像这样:

所以我尝试为这两个单选按钮提供唯一 ID,看看它是否解决了问题:

@Html.RadioButtonFor(m => m.property1, true, new {@id = "property1_true"})
@Html.Label("Yes")
@Html.RadioButtonFor(m => m.property1, false, new {@id = "property1_false"}))
@Html.Label("No")

它没有。在 Google Chrome 中,HTML 如下所示:

<!-- model property1 -->
<div class="form-group col-md-4">
    <label for="property1">Lorem ipsum dolor sit amet, consectetur adipisicing elit?</label>
    <div class="form-control">
        <input id="property1_true" name="property1" type="radio" value="True" />
        <label for="Yes">Yes</label>
        <input id="property1_false" name="property1" type="radio" value="False" />
        <label for="No">No</label>
    </div>
</div>

我正在运行适用于 Windows 的 Safari 5.1.7 和 Chrome 37.0。

【问题讨论】:

  • 在这些浏览器的控制台中,您是否看到任何错误?你也可以发布那些浏览器呈现的html吗?
  • @Matt 感谢您的回复。我添加了 Chrome 呈现的 HTML。我相信 Safari 以相同的方式呈现它,但如果需要,我愿意仔细检查。至于控制台错误,我收到与 jQuery-migrate 相关的错误:JQMIGRATE: Logging is active JQMIGRATE: jQuery.event.handle is undocumented and deprecated 等。没有别的了。我不认为这些错误与这个问题有关。
  • 有趣的是标签在那里并且正确但它们不显示。出于好奇,如果您将渲染的代码放入您的视图而不是助手中,它会正确渲染吗?
  • @Matt 我知道,对吧?但是不,当我将呈现的 HTML 复制并粘贴到我的视图中时,单选按钮仍然不显示。
  • 不幸的是,我现在不知所措。我唯一的建议是尝试消除该错误。过去,当我遇到错误时,我的观点发生了奇怪的事情

标签: css asp.net asp.net-mvc-4 google-chrome safari


【解决方案1】:

经过多次调查,解决方案非常简单。我没有仔细检查 CSS:

input:not([type='checkbox']) {
    -webkit-appearance: none;
}

所以这不是一个真正的浏览器兼容性问题,也不是编码问题,也不是格式错误的 HTML 问题(等等等等)。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2011-07-02
    • 1970-01-01
    • 1970-01-01
    • 2013-01-19
    • 1970-01-01
    • 2020-10-11
    • 1970-01-01
    相关资源
    最近更新 更多