Question

我有ViewBag这样的

ViewBag.ApplyDiscount = false;
ViewBag.ExpressShip = true;
ViewBag.Supplier = null;

和一些cshtml这样的代码片段

Discount:<input type="checkbox" checked="@ViewBag.ApplyDiscount"/>
Express:<input type="checkbox" checked="@ViewBag.ExpressShip"/>
Supplier:<input type="checkbox" checked="@ViewBag.Supplier"/>

在剃刀渲染cshtml片段后，真正的html将是

Discount:<input type="checkbox"/>
Express:<input type="checkbox" checked="checked"/>
Supplier:<input type="checkbox"/>

但如果我在checked属性和=之间添加空格

Discount:<input type="checkbox" checked ="@ViewBag.ApplyDiscount"/>
Express:<input type="checkbox" checked ="@ViewBag.ExpressShip"/>
Supplier:<input type="checkbox" checked ="@ViewBag.Supplier"/>

razor将以错误的方式呈现cshtml代码段。 html将是这样的：

Discount:<input type="checkbox" checked ="False"/>
Express:<input type="checkbox" checked ="True"/>
Supplier:<input type="checkbox" checked =""/>

无论MVC4（VS2012）还是MVC5（VS2015）都会发生这种情况。

那么，任何人都可以告诉我为什么一个空间会导致这件事发生吗？

Answer 1

因为checked本身是来自旧版HTML的特殊独立布尔属性，并且可以是没有属性值的有效语法。

单独存在表示已选中此框。

e.g。

<input type="checkbox" checked />

和

<input type="checkbox" checked="true" />

以同样的方式行事。这就是为什么在jquery中我们总是使用：checked选择器。它模糊了检查变化的必要性。

当HTML的属性与其值之间存在空格时，Razor会中断

1 个答案: