Question

如果有人有任何建议或其他方式帮助。我有

1 Textbox
1 Label
1 LinkButton

当我点击lnk_NameEdit按钮txtUserName时，可见，lblusername按钮必须不可见，标签中的文字会显示在TextBox

<td width="237" class="value_td" style="border: 0; border-top: 1px solid #afc0f3;">
      <asp:Label ID="lblusername" runat="server" Text="Santosh"></asp:Label>
      <asp:TextBox ID="txtUserName" runat="server" Width="300" Visible = "false">    
      </asp:TextBox>
</td>


<td width="64" class="epotions_td" style="border: 0; border-top: 1px solid #afc0f3;">
   <span>
        <asp:LinkButton ID="lnk_NameEdit" runat="server" CommandName="Edit" OnClientClick = 'ControlVisible();'>Edit</asp:LinkButton>
   </span>|
</td>

<script language="javascript" type="text/javascript">
     function ControlVisible() {

         var lbl = document.getElementById("<%= lblusername.ClientID %>");
         var txt = document.getElementById("<%= txtUserName.ClientID %>");        

         lbl.visible = false;         
         txt.visible = true;
     }
</script>


<td width="237" class="value_td" style="border: 0; border-top: 1px solid #afc0f3;">
      <asp:Label ID="lblusername" runat="server" Text="Santosh"></asp:Label>
      <asp:TextBox ID="txtUserName" runat="server" Width="300" Visible = "false">    
      </asp:TextBox>
</td>

我有1 LinkButton

<td width="64" class="epotions_td" style="border: 0; border-top: 1px solid #afc0f3;">
   <span>
        <asp:LinkButton ID="lnk_NameEdit" runat="server" CommandName="Edit" OnClientClick = 'ControlVisible();'>Edit</asp:LinkButton>
   </span>|
</td>

当我点击lnk_NameEdit按钮txtUserName时，可见且lblusername按钮必须不可见，标签中的文字将显示在TextBox中

  <script language="javascript" type="text/javascript">
 function ControlVisible() {

     var lbl = document.getElementById("<%= lblusername.ClientID %>");
     var txt = document.getElementById("<%= txtUserName.ClientID %>");        

     lbl.visible = false;         
     txt.visible = true;
 }

Answer 1

试试这个，

lbl.style.visibility="visible";         
txt.style.visibility="hidden";

Answer 2

假设其余代码正确，lbl和txt将是dom元素。 Dom元素没有可见的属性，但你可以通过设置它们的样式来隐藏它们。显示属性：

lbl.style.display = "none";

修改

确保在 dom准备好后运行此代码。您从document.getElementById获取null可能意味着您正在head部分中运行此脚本。结果，你的dom还没有被解析，你的标签和文本框还没有存在。

解决此问题的最简单方法是将脚本部分放在身体的最末端。另一种方法是从你的身体呼叫ControlVisible：<body onload="ControlVisible()">

Answer 3

服务器执行代码和客户端代码之间存在很大差异。在你混合的那一刻。

您可以设置客户端（javascript）中元素的可见性设置display属性 http://www.w3schools.com/jsref/prop_style_display.asp

看一下本教程：http://www.javascriptkit.com/javatutors/dom3.shtml

你可以改变这个og代码：

lbl.visible = false;         
txt.visible = true;

到此：

lbl.style.display= "none";         
txt.style.display= "block";

如果您正在使用服务器端代码（例如Load事件，asp.net按钮单击等），您可以使用对象的visible属性。

示例小提琴：http://jsfiddle.net/WzTSR/

Answer 4

标识为txtUserName的文本框中包含Visible = "false"，表示未将其发送到浏览器 - 因此您会收到客户端错误。

将其更改为：

<asp:TextBox ID="txtUserName" runat="server" Width="300" style="display: none;">

默认情况下仍会使其不可见，然后将行更改为：

lbl.style.display = "none";
txt.style.display = "";

面对javascript getelementbyid的困难

4 个答案: