2

有一个奇怪的问题,我希望人们可以解决一些问题。当我在我的 jQuery Mobile MVC 4 项目中使用复选框和单选按钮制作表单时,如果我使用 Razor 语法根据视图模型(例如 @Html.RadioButtonFor 等)吐出控件,而不仅仅是编写标准输入类型="radio",jQuery Mobile 不会将样式应用于元素。包括屏幕截图和代码差异。这与控件的呈现方式有关吗?发生在视图和部分视图中。

我在这里只更改了第一组单选按钮来说明这一点。如果我将整个表单更改为 Razor HTML 帮助程序,我将在所有控件中得到相同的结果。

非剃须刀: 非剃刀 剃须刀: 剃刀

非 Razor 代码:

<fieldset data-role="controlgroup" data-type="vertical" class="recurrencyArea">
                                <legend></legend>
                                <input type="radio" data-theme="b" name="Period" id="Daily" value="Daily" checked="checked" />
                                <label for="Daily">Daily</label>

                                <input type="radio" data-theme="b" name="Period" id="Weekly" value="Weekly" />
                                <label for="Weekly">Weekly</label>

                                <input type="radio" data-theme="b" name="Period" id="Monthly" value="Monthly" />
                                <label for="Monthly">Monthly</label>
                            </fieldset>

剃须刀代码:

<fieldset data-role="controlgroup" data-type="vertical" class="recurrencyArea">
                                <legend></legend>
                                @Html.LabelFor(x=>x.Period, "Daily")
                                @Html.RadioButtonFor(x => x.Period, "Daily", new { data_theme = "b", @Checked = "checked", id = "Daily"  })

                                @Html.LabelFor(x=>x.Period, "Weekly")
                                @Html.RadioButtonFor(x => x.Period, "Weekly", new { data_theme = "b", @Checked = "checked", id = "Weekly"  })

                                @Html.LabelFor(x=>x.Period, "Monthly")
                                @Html.RadioButtonFor(x => x.Period, "Monthly", new { data_theme = "b", @Checked = "checked", id = "Monthly"  })
                            </fieldset>

jquery 移动脚本在页面上运行后是否正在生成 razor html?

任何有任何有用想法的人/或者任何能够发现任何愚蠢错误的人都会成为英雄!

非常感谢,克里斯蒂安

4

1 回答 1

2

我对 jquerymobile 不太熟悉,但我可以在这里看到的故障是,对于 html 代码,您的标签如下所示:

<label for="Daily">Daily</label>

而剃刀代码将输出如下标签:

<label for="Period">Daily</label>

剃刀代码中的“for”属性对于您的场景是错误的,也许 jquery mobile 对此敏感?

于 2012-10-11T10:20:28.917 回答