JQuery ASP隐藏问题

根据复选框的结果，我想隐藏/显示隐藏表（隐藏页面加载），要求提供更多信息。JQuery ASP隐藏问题

JQuery和ASP在下面，有人能指出我在正确的方向，让我知道我做错了这种方法。

ASP

<h3>Table Heading</h3> 
    <asp:Table ID="tbl1" runat="server"> 
     <asp:TableHeaderRow> 
      <asp:TableHeaderCell> 
       <h4>One</h4> 
      </asp:TableHeaderCell> 
     </asp:TableHeaderRow> 
        <asp:TableRow> 
      <asp:TableCell> 
       <asp:CheckBox ID=""Yes" runat="server" Checked="false" Text="Yes" /> 
       <asp:CheckBox ID="No" Text="No" runat="server" Checked="false" /> 
      </asp:TableCell> 
     </asp:TableRow> 
    </asp:Table> 
    <asp:Table ID="tbl2" runat="server" Visible="false"> 
     <asp:TableHeaderRow> 
      <asp:TableHeaderCell> 
       <h4>Additional information</h4> 
      </asp:TableHeaderCell> 
     </asp:TableHeaderRow> 
     <asp:TableRow> 
      <asp:TableCell><asp:TextBox ID="AddInfo" runat="server" TextMode="MultiLine"></asp:TextBox></asp:TableCell> 
     </asp:TableRow> 
    </asp:Table>

JQuery的

<script type="text/javascript"> 
    function toggleTable() 
    { 
     $(function() { 
      $("#Yes").click(function() { 
       $("#tbl2").show(); 
      }) 
      $("#No").click(function() { 
       $("#tbl2").hide(); 
     }) 
    } 
</script>

更新1件 作为建议我删除了包装功能部件，这仍然没有工作。

<script type="text/javascript"> 
     $(function() 
     { 
      $("#Yes").click(function() { 
       $("#tbl2").show(); 
     }) 
      $("No").click(function() { 
       $("#tbl2").hide(); 
      }) 
     }) 
</script>

原始HTML

<h3></h3> 
    <table id="MainContent_tbl1"> 
<tr> 
    <th> 
       <h4></h4> 
      </th> 
</tr><tr> 
    <td><input id="MainContent_Yes" type="radio" name="ctl00$MainContent$Yes" value="Yes" /> 
    <label for="MainContent_Yes">Yes</label><input id="MainContent_No" type="radio" name="ctl00$MainContent$No" value="No" /> 
    <label for="MainContent_No">No</label></td> 
</tr>

来源

2014-11-24 SelrekJohn

当你已在服务器控件，作这使用visible=false - 这完全去除的控制从页面呈现时。

有关Visible属性的更多信息 - 如果此属性为false，则不呈现服务器控件。您应该在组织页面布局时考虑到这一点。如果容器控件不是呈现，它包含的任何控件将不会呈现，即使您将单个控件的可见属性设置为true。 - http://msdn.microsoft.com/en-us/library/system.web.ui.control.visible(v=vs.100).aspx

所以我会建议，如果你是从服务器端代码显示/隐藏，然后设置属性（CSS）风格=显示无。如果您直接使用visible属性并将其设置为false，则它将从页面中删除控件，将无法在页面中显示。

E.g. tbl1.Attributes.Add("style", "display:none");

在客户端使用style=display:none"隐藏它而不是visible=false。

此外，请使用.ClientID来获取jQuery选择器的确切呈现标识。像

$("#<%=tbl1.ClientID%>").show();

来源

2014-11-24 17:02:27

谢谢你，我改变了服务器端部分，因为没有回发。但是我无法让JQuery部分工作。 $（函数（） { $（ “＃<％= Yes.ClientID％>”）点击（函数（）{ $（ “＃TBL2”）显示（）;} ） $（ “＃<％= No.ClientID％>”）。点击（功能（）{ $（“＃tbl2”）。hide（）; }） }） – SelrekJohn 2014-11-24 17:16:15

您已经标记了一些帖子作为答案，仍然面临问题？我也告诉过你使用'$（“＃<％= tbl1.ClientID％>”）。show（）'not'$（“＃tbl1”）。show（）;' - 只是一个例子。 – 2014-11-24 17:21:38

拿走toggleTable()包装功能部件，它应该工作就像你建议。

$(function() {在文档准备就绪时运行，并应在该点打开点击监听器。

我也想指出逻辑是有缺陷的。复选框都可以打开，所以你可能想使用单选按钮，所以只能选中一个。

来源

2014-11-24 16:38:17

感谢您的建议，我已经更新了一个问题，即没有不幸工作。 – SelrekJohn 2014-11-24 16:41:43

你可以发布吐出另一边的RAW HTML吗？ – 2014-11-24 16:42:52

您的页面声明中可能需要'ClientIDMode =“Static”'，以使所有'runat =“server”'项目具有正确的'id' – 2014-11-24 16:46:09

在你的jQuery通过客户端ID得到寄托都因为它是用asp将其重命名（你可以看到它增加MainContent_到你的控件ID），所以这样做：

$("<%=tbl2.ClientID %>").click{....

或者添加的ClientIDMode =“静“你的控制，例如：

<asp:Table ID="tbl1" runat="server" ClientIDMode = "Static">

来源

2014-11-24 16:59:15 Zaki

JQuery ASP隐藏问题

回答

相关问题