在JavaScript中获取asp.net控件

Question

我有一个页面，它的代码像这样:

var textBox = $get("<%=textState.ClientID%>");

这需要我将JavaScript代码放在页面内而不是美好地收纳在js文件中。有更好的方法吗？ 由于这样，document.getElementById无法使用，因为最终我会得到像下面这样的代码：

var textBox = document.getElementById("originDestinationControl_textState");

或者

var textBox = document.getElementById("ctl00_ContentPlaceHolder_originDestinationControl_textState");

根据我引用这些控件的位置（在主页和/或用户控件内），情况可能有所不同。

- Boone

Answer 1

我通常会将这样的代码加入到需要使用单独js文件的页面中。

<script type="text/javascript">
    var pageNameElements = {
        textbox : '<%= textbox.ClientId %>',
        button : '<%= button.ClientId %>'
    };
</script>

这样，您将获得一个漂亮的 JavaScript 对象，其中包含所有控件 ID，您可以在 js 文件中像这样使用它。

$('#' + pageNameElements.textbox)

或者

document.getElementById(pageNameElements.textbox)

如果您没有使用jQuery。

- Oscar Kilhed

---

实际上对我来说这不起作用。 我得到了nullJS文件: var myTextBox = document.getElementById(pageOriginElements.textOriginMultiState); alert(myTextBox);ASCX:<script type="text/javascript"> var pageOriginElements = { textOriginMultiState : '<%=textOriginMultiState.ClientID%>', textOriginMultiStateCountry : '<%=hiddenOriginMultiStateCountry.ClientID%>' }; - Boone

确保JS文件中的函数在包含元素ID的对象创建后执行，即将JS文件添加到</body>标签之前，或使用jQuery $(document).ready()函数在DOM准备就绪时执行它。 - Oscar Kilhed

Answer 2

我建议学习jQuery，自从我开始使用它以来，我再也没有必须处理混乱的asp标签才能获取页面上的控件。

var textBox = $get("<%=textState.ClientID%>");

会看起来像这样：

var textBox = $("input[id$='_textState']");

在jQuery中，你甚至可以将它放入自己的js文件中！

- Jagd

Answer 3

使用 .NET 4.0，您实际上可以完全控制此操作：

http://www.codeproject.com/KB/aspnet/ASP_NET4_0ClientIDFeature.aspx

它已经与Visual Studio 2010一起发布了Release Candidate版本。我知道这不是一个理想的解决方案，但这是其中之一。

http://msdn.microsoft.com/en-us/vstudio/dd582936.aspx

- Keith Adler

Answer 4

我觉得你卡住了。

你的textState.ClientId代码需要留在aspx页面上。这是因为它是客户端渲染的。JavaScript包含文件与页面的其余部分分别下载，因此它不知道如何处理它。

如果你需要清理这个问题，可以尝试使用经典的asp样式包含文件。然而，在asp.net中，它们会增加更多的混乱而不是解决问题。

- AaronS