2012-06-05 165 views
4

我有我的Page_Load注册这个如何隐藏或显示一个div

Page.ClientScript.RegisterStartupScript(this.GetType(), "clientscript", "document.getElementById('showdiv').style.visibility = 'hidden';", true); 

但它没有得到隐藏的......是如我的div下面

<div id="showdiv"> 
    <input class="button" type="button" value="OK" name="success_button" id="my button" onclick="javascript:window.close();" /> 
    </div> 

我在做什么错?。感谢您的帮助

+0

你有任何的UpdatePanel? –

+1

尝试寻找页面源代码是否真的在做什么。 – IvanH

+0

请检查以下建议:http://stackoverflow.com/questions/9572265/which-of-these-methods-is-the-correct-way-to-show-hide-rows-in-asp-net – atconway

回答

5

我强烈建议用JavaScript来做这个简单的客户端操作(show/hode rows controls等),或者更加容易地用jQuery等.js库。在应用程序中包含jQuery脚本之后,只需在页面完成初始化后隐藏DIV即可。

包含在您的网页或引用的.js顶这个脚本文件节如果你已经有一个:

<script type="text/javascript"> 

//$(document).ready is used to define a function that is guaranteed to be called only after the DOM has been initialized. 
$(document).ready(function() { 
    //Hide the div 
    $('#showdiv').hide(); 
    //conversely do the following to show it again if needed later 
    //$('#showdiv').show(); 
}); 

</script> 
这种方法

jQuery的API文档:
http://api.jquery.com/hide/

+0

我推荐使用javascript在后端代码中隐藏div。 JS存在的问题是div会一直显示直到页面加载完成,然后页面布局会在div被隐藏时跳转。快速互联网连接上的用户可能不会看到这一点,但较慢的连接(如手机)会在文档完全加载之前看到div。 – ideonexus

+0

我不同意 - 服务器上简单的DOM操作是我们在网络早期做得不好的。这正是JS允许我们做的语言。这是浪费的,相反,无论互联网速度如何,完整的服务器调用来做这样的操作不是一个好的选择国际海事组织。事实上,进入JS框架和SPA的世界并没有这样的东西会远程甚至被认为是在服务器上完成。 – atconway

4

为什么不使用asp:Panel服务器标签?

前端:

<asp:Panel runat="server" ID="ShowDiv"> 
... 
</asp:Panel> 

后端:

ShowDiv.Visible = false; 

Panel的控制将被呈现为<div>在运行时。这似乎比注册客户端脚本更清洁。

+1

我同意这一点。这是使用asp.net的最佳做法。没有理由注入客户端代码来完成服务器可以处理的简单任务,特别是如果您已经在服务器端。 –

+0

我需要注入它,因为我需要对Ajax调用的OnSuccess隐藏到asmx服务 – user1416156

+0

@KP我*完全*不同意您的陈述。为什么在这个世界上,开发人员想要做一次昂贵的往返服务器来做一些像隐瞒一样卑鄙的行为?这恰恰是JavaScript在这种情况下打算做的事 - 无需去服务器就可以操纵客户端的需求。我知道我仍然会进行服务器调用,但是为什么服务器会执行应该由客户端处理负责的操作。 – atconway

0

我想这是另一个加载顺序问题。

您的脚本一运行就会运行。如果它试图隐藏的页面元素在脚本运行时没有加载到DOM中,那么就没有什么可以隐藏的。我相信注册的脚本都会在HTML内容之前进入页面的顶部,所以这会一直发生。

为了使这个工作,你必须把它放在一个加载事件监听器中。请参阅:Running javascript code on page load, without using the onload tag

这就是说,因为你想隐藏的页面元素,没有条件,你可能是一样高兴在服务器端把这个页面元素关闭,或者通过添加一个类的元素您的CSS会隐藏起来,或者直接从服务器代码中操纵它的风格/可见性。

如果应该有关于Div是否可见的一些条件,那么在客户端JavaScript中完成所有操作可能会更好,这样您就不必为了控制可见性而进行服务器访问。

2

你有2个选项

1,添加来自代码“RUNAT =服务器”属性的DIV那么后面访问它,使能见度虚假或添加样式,使其不可见。

myDiv.Style.Add("display","none"); 

2-添加javascript函数来隐藏它,你可以使用jQuery来做到这一点。

1

的Javascript:

$(document).ready(function(){ 

    $(".slidingDiv").hide(); 
    $(".show_hide").show(); 

$('.show_hide').click(function(){ 
$(".slidingDiv").slideToggle(); 
}); 

}); 

HTML

<a href="#" class="show_hide">Show/hide</a> 
<div class="slidingDiv"> 
Fill this space with really interesting content. 
<a href="#" class="show_hide">hide</a> 
</div> 

CSS

.slidingDiv { 
height:300px; 
background-color: #99CCFF; 
padding:20px; 
margin-top:10px; 
border-bottom:5px solid #3399FF; 
} 

.show_hide { 
display:none; 
} 
1

我来到这里寻找一个解决方案和e nded up将“runat = server”添加到我的div中,然后将其隐藏在代码隐藏中

myDivID.Visible = false;

4

HTML

<div id="div1" runat="server"></div> 

C#

div1.Visible=false; 

我认为这会工作...

+0

我认为这是最直接,客户友好的解决方案。用户可能需要使用Control div1 =(Control)FindControl(“div1”)来查找控件。如果控制不在智能感知中找到它。 – ideonexus

0

我们创建的链接调用JavaScript的

<p><a href="#" class="show_hide" onclick="recoverDiv();">Mot de passe oublié</a></p> 

的div来显示和隐藏

<div id="divdiv" runat="server" class="HideMe"> 
</div> 

,并加入JavaScript:

<script type="text/javascript"> 

    function recoverDiv() { 
     $('#divdiv').attr('class', 'ShowMeForced'); 
    } 
</script> 

和CSS:

<style type="text/css"> 
    .HideMe { display:none; } 
    .ShowMe { display:block; } 
    .HideMeForced { display:none !important; } 
    .ShowMeForced { display:block !important; } 
</style>