当我使用母版页时，为什么我的所有元素都被重命名？

Question

我不明白为什么这很有用。我有一个带有名为 Main 的内容持有者的母版页，并且有一个带有匹配内容标签的内容页。然而，我注意到，当页面放在一起时，我的一些元素的 id 发生了变化，或者我应该说是变态，就像这样：

<input value="fizz-buzz" name="ctl00$Main$options" type="radio" id="Main_foobar"/>

这对我的 css 造成了严重破坏。请帮忙。

Answer 1

这是为了确保来自不同来源的多个 ID 始终具有唯一的名称。

在ASP.NET 4.0中，您可以将ClientIDMode设置为静态，并且控件不会被重命名。

Answer 2

这就是 ASP.net 中的情况（直到 3.5）。这是为了避免添加到不同内容占位符的控件的重复 ID 和名称。

在 ASP.net 4.0 中，您可以控制控件 Id 的生成方式。

Answer 3

当您需要自定义 ASP.net 控件的样式时，请始终设置其 CssClass 属性并在样式表中引用它，即使该控件应该是唯一的。类名永远不会改变。

Answer 4

如果你卡在 3.5 上并且无法升级到 4.0，我只是在 codeplex 上放了一个我已经使用多年的解决方案。

http://awesomeclientid.codeplex.com/

几天前才上传，但基本上它序列化了所有您指定到 HTML 文档上的 Json 数组的控件，以便在 JavaScript 中使用。

我在这里写了一篇关于它的快速块文章：

http://www.philliphaydon.com/2010/12/i-love-clean-client-ids-special-with-net-2-0/

您可以注册 HTTPModule ，或者在 PreRenderComplete 上逐页启动并序列化页面，您最终会得到文档中的 JavaScript 块，其内容如下：

<script type=”text/javascript”>
//<![CDATA[
var controls = {
"txtUserName": "ctl00_ContentPlaceHolder1_txtUserName",
"txtEmail": "ctl00_ContentPlaceHolder1_txtEmail",
"btnSubmit": "ctl00_ContentPlaceHolder1_btnSubmit"
};
//]]>
</script>

然后，当您编写 JavaScript 时，您可以执行以下操作：

<script type=”text/javascript”>
//<![CDATA[
var element = document.getElementById(controls.btnSubmit);
//]]>
</script>