asp.net - Asp.net 复选框和 html 数据属性

Question

在 asp.net 中，如果您使用自定义属性，通常它会按原样呈现。

考虑到这个标记（注意：所有示例中都删除了和等属性，id因为它们生成的 id/name 很冗长）：namefor

<asp:TextBox runat="server" data-foo="bar" />

在 asp.net 中呈现为：

<input type="text" data-foo="bar" />

也就是说，asp.net 保持data-foo不变。

复选框通常呈现如下：

<asp:CheckBox runat="server" Text="Normal" />

呈现为：

<input type="checkbox" />
<label>Normal</label>

但是，如果您在复选框上添加自定义属性：

<asp:CheckBox runat="server" Text="Custom attribute" data-foo="bar"  />

它呈现为：

<span data-foo="bar">
    <input type="checkbox" />
    <label>Custom attribute</label>
</span>

如您所见，呈现了一个跨度以保存该属性。如果您在后面的代码中添加属性，也会发生这种情况。任何其他 HtmlControl、AFAIK 都不会发生这种情况。

有谁知道为什么渲染这个跨度来保存属性？

无论如何要在输入标签中呈现属性？

score 22 · Accepted Answer

我不确定为什么它用跨度呈现，但我想你可以像这样直接将属性添加到代码隐藏input的元素中：CheckBox

myCheckBox.InputAttributes.Add(...)

参考链接：

更新

使用了一个额外的父元素，以便应用到 a 的属性CheckBox可以同时影响 theinput和文本。我想它是 a span（而不是 a div），因为它是一个内联元素，使得在不同场景中使用起来更方便。

参考链接：

score 4 · Accepted Answer

这是渲染引擎构建CheckBox控件的方式，没有太多可做的。

您可以做的就是创建一个runat="server"输入。

<input id="myInput" runat="server" type="checkbox" data-foo="bar"/>
<label>Custom attribute</label>

另一种选择是data-foo在文档加载时使用 jquery 添加属性

$(function(){
    $('span[data-foo]').each(function(){
        var $span = $(this);
        var value = $span.data('foo');
        $span.find('input').data('foo',value);        
    });
})

score 1 · Accepted Answer

Just to add another method that I use when all else fails, you can always use a literal control and make it render whatever you want. You need to do a bit more work when handling the postback, but sometimes this is the only way to get the html you need.

Markup:

<asp:Literal ID="myLiteral" runat="server"/>

Codebeside:

myLiteral.Text = string.Format("<input type=\"checkbox\" data-foo=\"{0}\" /><label>Normal</label>", value)

score 0 · Accepted Answer

如果您尝试在单击事件上访问该属性，则可以通过强制转换控件来实现。例如，我有一个复选框，我像你一样为它分配了一个自定义属性

<asp:CheckBox runat="server" data-foo="bar" />

现在OnCheckedChanged我需要得到那个值，在我的方法中我得到了一个sender对象。

protected void chk1_CheckedChanged(object sender, EventArgs e)
{
    CheckBox myControl = (CheckBox)sender;
    string value = myControl.Attributes["data-foo"].ToString();

}

我希望这对某人有帮助

asp.net - Asp.net 复选框和 html 数据属性

4 回答 4

Related

Reference