Question

我有一个带有asp控件的webform，我想看看是否检查它是否显示更多信息（Checkbox1已经过检查 - ＆gt; div：yourDivClass show）。但是在我的页面中它没有用这是我的代码：

＆＃13;

<%@ Page Title="Form" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Form.aspx.cs" Inherits="WebApplication1.Form" %>
<asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server">
<!DOCTYPE html>  
<html>  
    <head>
        <style>
.yourDivClass{
    display:none;}
        </style>
        <script language="text\javascript">
            $("#CheckBox1").change(function () {
                if ($(this).attr('checked')) {
                    $(".yourDivClass").show();
                }
            });
        </script>
    </head>
<body>  
    <asp:Panel ID="Panel1" runat="server">
        <table>            
            <tr>
                  <td >Do you have...?</td>  
                <td class="hiddenText"> 
                    <asp:CheckBox ID="CheckBox1" runat="server" />
                    </td> 
            </tr>           
        </table> 
      </asp:panel>   
<div class="yourDivClass">Im Your div</div>    
    <table>
          <tr>  
                <td>  
                    <asp:Button ID="Button1" runat="server" Text="Submit" ForeColor="#FF66FF" OnClick="Button1_Click" />  
                </td>  
                <td>  
                    <asp:Label ID="Label1" runat="server" Text="Label" Visible="false"></asp:Label>  
                </td>  
            </tr> 
    </table>
</body>  
</html>
</asp:Content>

＆＃13;

任何想法

Answer 1

因为这是一个asp控件，CheckBox1的ID正在获取额外的字符串。对于客户端操作添加：

ClientIDMode="Static"

到您的asp控件。

你可以看一下这个例子： jQuery Selector for server side control

或者您可以尝试使用此选择器：

$("input[id$='_CheckBox1']")

看看这个有效的例子：

<ul runat="server" ClientIDMode="Static" id="DatesPickList" class="datesPickList">


$("#DatesPickList").css("background", "red");

Answer 2

这是有效的：

＆＃13;

<%@ Page Title="Form" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Form.aspx.cs" Inherits="WebApplication1.Form" %>

<asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server">
   
    <!DOCTYPE html>  

<html>  
    <head>

        <script type="text\javascript">
      
             <link href="https://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet" type="text/css" />
        <script src="https://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
        <script>
            function ShowPanel1() {
                //Check if checkbox is checked or not
                if ($('#CheckBox1').is(':checked')) {
                    //Show the Panel
                    $('#Panel2').show();
                }
                else {
                    //Hide the Panel2
                    $('#Panel2').hide();
                }
            }


        </script>

    </head>
<body>  
    <asp:Panel ID="Panel1" runat="server">
        <table class="auto-style1">  
        
            <tr>
                  <td class="auto-style3">Do you have ... ?</td>  
                <td class="hiddenText"> 
                    <asp:CheckBox  ClientIDMode="Static" ID="CheckBox1" runat="server" onchange="javascript:ShowPanel1()" />
                    </td> 
            </tr> 
            <tr>  
                <td class="auto-style2"> </td>  
                <td class="auto-style4"> </td>  
                <td> </td>  
            </tr>  
          
        </table> 
      </asp:panel>
    <div>
        <br />
    </div>
 <asp:Panel ID="Panel2" runat="server" ClientIDMode="Static" Style="display: none">Test Panel</asp:Panel>
        <div>  
        </div>  
  
    <p>  
           
    </p>  
    <table>
          <tr>  
                <td class="auto-style2"> </td>  
                <td class="auto-style4">  
                    <asp:Button ID="Button1" runat="server" Text="Submit" ForeColor="#FF66FF" OnClick="Button1_Click" />  
                </td>  
                <td>  
                    <asp:Label ID="Label1" runat="server" Text="Label" Visible="false"></asp:Label>  
                </td>  
            </tr> 
    </table>
</body>  
</html>
</asp:Content>

＆＃13;

webform没有运行脚本

2 个答案: