在事件字符串中扩展 ClientID答案

【问题标题】：Expanding ClientID in an event string在事件字符串中扩展 ClientID
【发布时间】：2011-01-08 00:47:54
【问题描述】：

我在 .ascx 用户控件中遇到扩展问题。

我有一个 .js 文件，其中包含一个 javascript 函数：

function doSomething(objectId)
{
    ...
}

我有一个 .ascx 文件，其中包含一些 html 元素，并且在一个元素的 onclick= 中，我想调用 doSomething()，传递该 .ascx 文件中元素的 ID，其中传递的 ID 是其他元素的比被点击的那个，所以我不能使用“this”。

举个例子可能会更清楚。

这行得通：

<script type="text/javascript">
    function redirect()
    {
        doSomething('<%= top.ClientID %>');
    }
</script>
<div id="top" runat="server">
    <img src="..." alt="..." onclick="redirect();"/>
</div>

但这不是：

<div id="top" runat="server">
    <img src="..." alt="..." onclick="doSomething('<%= top.ClientID %>');"/>
</div>

当我查看源代码时，我发现没有发生替换，而不是“doSomething('ctl00_myControl_top');”我得到“doSomething('');”

由于某种原因，脚本扩展发生在前一种情况下，但不是在后一种情况下。当然，这种解决方法是不可接受的，因为如果我在一个页面上包含多个控件副本，它会中断 - 只有一个实例的“redirect()”函数可以访问。

关于如何使这种替换起作用的任何想法？

【问题讨论】：

你有一个表单标签内的 div 是 runat='server' 对吗？
整个服务器控件包含在一个带有 runat="server"、div 和脚本部分的表单标签中。

标签： asp.net javascript clientid

【解决方案1】：

在我的机器上工作？

<div id="top" runat="server">
    <a href="#" onclick="doSomething('<%= top.ClientID %>')">rarrarara</a>
</div>

变成

<div id="ctl00_ContentPlaceHolder1_top">
    <a href="#" onclick="doSomething('ctl00_ContentPlaceHolder1_top')">rarrarara</a>
</div>

【讨论】：

我预计它会在我的机器上，这就是为什么当它没有时我如此惊讶的原因。我以为我已经检查了所有可笑的明显错误，也许我没有。
尝试将 ID 和 runat="server" 添加到您的锚点。似乎如果我在具有 onclick 事件的元素上有一个 runat="server" 标记，则不会发生扩展。
这显然是微软决定不支持的东西。谷歌对此错误消息：“服务器标签不能包含构造。”。解决方案是在代码隐藏中执行 Attributes.Add("onclick", "")。
啊，你的例子在 img 标签上没有 runat="server" :)

【解决方案2】：

考虑替代路线：

确保您在 JavaScript 中使用内联表达式 <%= (controlName).ClientID %> 引用的控件将其“ClientIDMode”说明符设置为静态值，然后只需使用该控件的 ID 字段中的文本来引用它。我最终在最近的一个项目中使用了它，效果很好。更详细的解释请看下面的链接：

Code Project - ASP.NET v4.0 Client ID Feature

除了将“ClientIDMode”说明符设置为“静态”之外，我还发现了一个有用的想法，即将全局资源文件中的文本（在语言切换的情况下）放入标准 HTML 控件的字段中，而不必在服务器级别运行。我在一个标准的 HTML 按钮上使用了这个按钮，该按钮应该调用一个显示/隐藏特定 div 或 ASP 面板的 JavaScript 函数。在内联表达式标签中使用 GlobalResource 函数，如下所示：

<input id="btnToggleFilterOptions" type="button" value="<%=GetGlobalResourceObject("SiteResource", "btnToggleFilterOption")%>" onclick="javascript:ToggleCssClass('divFilterOption','visible'); return false;" class="button submit" />

<asp:Panel ID="divFilterOption" ClientIDMode="Static" runat="server">
    <asp:TextBox ID="txtFilterOption1" runat="server" />
</asp:Panel>

我知道这是一篇旧帖子，但在 Google 上搜索 Asp .NET 和 ClientID 时它很受欢迎。我希望这对其他人有所帮助！

【讨论】：