如何从Javascript函数设置ASP.NET控件的"可见"属性？

基本上我想知道从Javascript函数隐藏/显示ASP.NET控件的最佳方法.我想我只需使用以下命令访问Javascript中的控件:

var theControl = document.getElementById("txtEditBox");

然后将控件的Visible属性设置为true/false.它似乎没有工作,我似乎无法弄清楚如何将"可见"设置为true/false.我怎样才能做到这一点？另外,这是从Javascript函数隐藏/显示ASP.NET控件的最佳方法吗？

谢谢,杰夫

ASP.NET控件的"Visible"属性确定它是否将在客户端上呈现(即发送到客户端).如果在呈现页面时它为false,则它将永远不会到达客户端.

因此,从技术上讲,您无法设置控件的属性.

这就是说,如果控制是在客户端上呈现,因为Visible属性为true时,页面呈现,您可以使用JavaScript这样便隐藏它:

var theControl = document.getElementById("txtEditBox");
theControl.style.display = "none";

// to show it again:
theControl.style.display = "";

这假设控件的id属性在客户端上确实是"txtEditBox"并且它已经可见.

另外,这是从Javascript函数隐藏/显示ASP.NET控件的最佳方法吗？

虽然一种更好的方法是使用CSS类定义,但不一定是"最佳"方式:

.invisible { display: none; }

当你想要隐藏某些东西时,动态地将该类应用于该元素; 如果要再次显示,请将其删除.注意,我相信这只适用于display价值开始的元素block.

而不是使用可见,将其CSS设置为display:none

//css:
.invisible { display:none; }

//C#
txtEditBox.CssClass = 'invisible';
txtEditBox.CssClass = ''; // visible again

//javascript
document.getElementById('txtEditBox').className = 'invisible'
document.getElementById('txtEditBox').className = ''

将样式设置为"display:none".

var theControl = document.getElementById("<%= txtEditBox.ClientID %>");
theControl.style.display = "none";