javascript 函数可以修改在 ASP.NET 中的服务器上运行的元素吗？

Posted 2023-02-22

【中文标题】javascript 函数可以修改在 ASP.NET 中的服务器上运行的元素吗？

【英文标题】：Can a javascript function modify an element that is running on server in ASP.NET?

【发布时间】：2013-04-19 20:47:47

【问题描述】：

为了测试，我创建了一个按钮，当点击该按钮时会隐藏一个文本框。按下按钮的 javascript 如下所示：

function showCommentBox() 
    var el = document.getElementById('replyBox');
    el.setAttribute("style", "display:none;");
    return false;

asp 代码如下：

<textarea  id="replyBox" runat="server" class="replyBox"></textarea>
<asp:Button runat="server" id="replyBtn" onClientClick="return showCommentBox();" class="replyBtnClass" Font-Bold="true" Text="Reply"/>

似乎每当我尝试修改服务器上运行的元素时，都会导致回发。我的逻辑有问题还是这不可能？

【参考方案1】：

如果您查看生成的服务器控件 id，您会发现它与您设置的不同。您设置的 id 是代码隐藏 ID。呈现页面时，将为元素分配其ClientID。这就是您遇到问题的原因。

你有两个选择：

将ClientIDMode 设置为“静态”。这会将元素的 id 保留为您设置的内容。确保仅当您只有一个具有此 ID 的元素时才执行此操作。否则你的 javascript 会开始奇怪。

动态设置 javascript 的 id。像这样：

document.getElementById('<% replyBox.ClientID %>');

这会将呈现的服务器控件的 ClientID 直接注入 javascript。注意：这仅适用于 javascript 在 aspx 页面中。如果将 javascript 移动到 js 文件中，这将不起作用。

【讨论】：

效果很好。还有很多我不知道的信息谢谢。

很高兴为您提供帮助。你实现了哪种方法？

我使用了 ClientIDMode 一段时间，直到我意识到最好用 div 标签封装盒子和其他东西，然后一次性隐藏所有内容。如果我一开始就走那条路，我不会发现这些东西，但再次感谢。

【参考方案2】：

在您的情况下，此行将返回 undefined

var el = document.getElementById('replyBox');

当您使用replyBox 作为具有runat="server" 属性的textarea 的ID 时。您需要在函数中使用ClientIdMode="Static" 或引用ClientId 的textarea，如下所示

document.getElementById('<% replyBox.ClientID %>');