使用Razor MVC3的条件HTML属性

变量strcsclass通常有一个值，但有时为空

我不想在这个输入元素的HTML中包含一个空class=“”，这意味着如果strcsclass为空，我根本不想要class=属性

以下是执行条件HTML属性的一种方法：

<input type="text" id="@strElementID" @(CSSClass.IsEmpty() ? "" : "class=" + strCSSClass) />

---

有没有更优雅的方法？具体来说，我可以使用与元素的其他部分相同的语法：class=“@strcsclass”？

我想更方便和结构化的方法是使用Html helper。在您看来，它可能看起来像：

@{
 var htmlAttr = new Dictionary<string, object>();
 htmlAttr.Add("id", strElementId);
 if (!CSSClass.IsEmpty())
 {
   htmlAttr.Add("class", strCSSClass);
 }
}

@* ... *@

@Html.TextBox("somename", "", htmlAttr)

@{
var htmlAttr=新字典（）；
htmlAttr.Add（“id”，strElementId）；
如果（！CSSClass.IsEmpty（））
{
添加（“类”，strcsclass）；
}
}
@* ... *@
@TextBox（“somename”，“htmlAttr”）

---

如果这种方法对您有用，我建议在您的模型中定义dictionary

htmlAttr

，这样您的视图就不需要任何

@{}

逻辑块（更加清晰）。

您没有从我这里听说过，Razor的PM，但是在Razor 2中（网页2和MVC4），我们将在Razor中内置条件属性（由于MVC4RC测试成功），所以您可以这样说

<input type="text" id="@strElementID" class="@strCSSClass" />

如果strcsclass为null，则class属性根本不会呈现

---

SSSHHH…不要说。：）

注意，您可以这样做（至少在MVC3中）：

或

只有在通过网络查看响应时，您才会看到这一点。如果使用HTML检查器，通常会看到DOM，而不是原始HTML。浏览器将HTML解析到DOM中，解析后的DOM表示已经应用了一些细节。在这种情况下，浏览器会看到属性值周围没有引号，并添加它们：

style=""border:0px""

但在DOM inspector中，HTML字符代码可以正确显示，因此您可以看到：

style=""border:0px""

在Chrome中，如果您右键单击并选择Edit HTML，它会切换回来，以便您可以看到那些讨厌的HTML字符代码，从而清楚地表明您有真正的外部引号和HTML编码的内部引号

所以，尝试自己引用的问题是，Razor无法逃避这些

如果你想完全控制报价 使用Html.Raw防止引号转义：

<td @Html.Raw( someBoolean ? "rel='tooltip' data-container='.drillDown a'" : "" )>

呈现为：

<td rel='tooltip' title='Drilldown' data-container='.drillDown a'>

---

以上是完全安全的，因为我没有从变量输出任何HTML。唯一涉及的变量是三元条件。但是，请注意，如果从用户提供的数据生成字符串，最后一种技术可能会使您面临某些安全问题。例如，如果您从源于用户提供的数据的数据字段构建属性，则使用Html.Raw意味着字符串可能包含属性和标记的过早结尾，然后开始一个脚本标记，该标记代表当前登录的用户（可能不同于登录的用户）执行某些操作。可能您有一个包含所有用户图片列表的页面，您正在将工具提示设置为每个人的用户名，一个用户将自己命名为

'/>$.post（'changepassword.php？password=123'）

，而现在任何查看此页面的其他用户的密码都会立即更改为恶意用户知道的密码。

-1，永远不要建议某人在视图中加入逻辑。W视图应仅负责渲染。添加一个HtmlHelper示例，我将为您提供+1。要测试东西，我可以在视图中使用代码块-它更快。我的建议是将此块移到模型中。是的，但答案应该显示最佳实践，而不是使代码维护成为噩梦的快速脏版本。@jgauffin我认为这里没有必要使用Html助手。看看我的答案。+1@Yaschur你的答案很鼓舞人心。继续努力。也就是说，通过C#显式转换功能，我们可以进一步增强这个答案。并非所有的代码都必须以某种方式形成。总有一种更好的方法我们不知道。一些项目支持代码组织。代码组织是实践而不是概念！是的，你绝对不应该接受我的答案。这就是说，今天没有更干净的方法来做这件事（因此我们正在创造一种更干净的方法来做）。可能最干净的方法是使用Html.TextBox，但它有一套不同的不太理想的东西（很高兴您喜欢我们添加的内容。：）但是如何将Razor属性与其他文本结合起来？我需要做以下几点：。。。id=“track@track.id”。我期望类似于……id=“track_2”，但它生成了以下输出：……id=“track_@track.id”……您可以通过在代码周围放置paren来强制Razor对代码进行求值。id=“track_u@（track.id）”添加了一条注释，表明它可以成功地与MVC4配合使用。如果您使用的是MVC 3，请参阅下面我的答案。@ErikPorter请不要弄乱我的HTML！！对于其他不良行为，也要看到这一点，这是一个非常好的观点！事实上，它使它在大多数情况下都可读和可用。这就是我在问题示例中所做的。感谢您提供更详细的解释和示例。：）不过要小心空格。“样式=显示：无；”渲染为无=“：=”style=“display”那么为什么这不起作用呢？它只是产生了@AaronLS是的，它们就是这样。无法理解浏览器（Chrome 40/FF33.1/IE 10）将如何影响任何内容，因为这是服务器生成的标记，如果是，为什么只有这两个类属性，而不是ask按钮的类属性，甚至是所有三个按钮的type=“button”属性。绝对是一个服务器的东西，因为我也可以RDP到分布在全球的两个Azure虚拟机中，以获得相同的结果，即IE/Firefox/Chrome。

style="border:0px"

style=""border:0px""

style=""border:0px""

<td @Html.Raw( someBoolean ? "rel='tooltip' data-container='.drillDown a'" : "" )>

<td rel='tooltip' title='Drilldown' data-container='.drillDown a'>