为什么ASP.Net RadioButton和CheckBox在Span内部呈现？

Question

我希望这个:

<asp:CheckBox    ID="CheckBox1"    runat="server" CssClass="myClass" />
<asp:RadioButton ID="RadioButton1" runat="server" CssClass="myClass" />
<asp:TextBox     ID="TextBox1"     runat="server" CssClass="myClass" />

...这样渲染(为简单起见,删除了一些属性):

<input id="CheckBox1"    type="checkbox" class="myClass" />
<input id="RadioButton1" type="radio"    class="myClass" />
<input id="TextBox1"     type="text"     class="myClass" /> 

...实际上,RadioButton并且CheckBox用一个span标签包装并在那里应用CSS类.

<span class="myClass"><input id="CheckBox1"    type="checkbox" /></span> 
<span class="myClass"><input id="RadioButton1" type="radio"    /></span> 
<input type="text" id="TextBox1" class="myClass" /> 

这有什么理由,是否有办法避免它？它使jQuery选择器变得丑陋,因为你无法捕获所有这些:

$("input.myClass")

当然,它只是:

$("input.myClass, span.myClass input")

......但那很难看.我可以编写自己的选择器,但同样不如它应该优雅.

Answer 1

这让我疯狂,直到找到inputAttributes属性.

例如,以下是如何在没有span废话的情况下直接在复选框控件上添加类:

myCheckBoxControl.InputAttributes.Add("class", "myCheckBoxClass")

Answer 2

System.Web.UI.WebControls命名空间中的Web控件可能在不同的浏览器中呈现不同.你不能指望他们总是渲染相同的元素.他们可能会添加他们认为需要的任何内容,以使其在特定浏览器中运行.

如果您想要控制如何将控件呈现为html,则应该使用System.Web.UI.HtmlControls命名空间中的控件.那是:

<input type="checkbox" id="CheckBox1" runat="server" class="myClass" />
<input type="radio" name="RadioButton1" runat="server" class="myClass" />
<input type="text" id="TextBox1" runat="server" class="myClass" />

它们将呈现为相应的html元素,不添加任何额外元素.这当然意味着您必须对浏览器兼容性负责,因为控件没有.此外,这些控件没有WebControls命名空间中控件的所有功能.

Answer 3

默认情况下,每个WebControl都会呈现为<span>标记,以及控件作者添加的任何自定义呈现.

编写自定义WebControl时,通常要做的第一件事就是覆盖" TagKey "属性来渲染div,或者除了span之外的其他东西.此属性的默认值为HtmlTextWriterTag.Span.

您可以对复选框项进行子类化并覆盖TagKey属性以呈现其他内容,但是您必须处理将所有复选框放入您自己的版本中.