訪問了jQuery元素通過的UpdatePanel

Question

回發後，我有一個小頁面具有以下ASPX標記

<fieldset style="width:40%; margin-left:50px;"> 
    <legend> Site User Role Management</legend> 
    <asp:Label ID="lblSiteUserDDl" runat="server" AssociatedControlID="ddlSiteUsers" 
     Text="Manage the roles in which a user is registered by selecting the user from the dropdown list below."></asp:Label> 
    <asp:DropDownList ID="ddlSiteUsers" runat="server" CssClass="dropdowns" AutoPostBack="True" ClientIDMode="Static" /> 
    <br /><br /> 
    <asp:UpdatePanel ID="updplRoleChange" runat="server" ClientIDMode="Static"> 
      <ContentTemplate> 
       <fieldset id="rolemanagement" style="width:80%;" Visible="false" runat="server" > 
        <legend id="rolemgmtlegend" runat="server"></legend> 

           <asp:Label ID="lblCurrentRole" runat="server" CssClass="literaltext"></asp:Label><br /> 
           <asp:Label ID="lblSiteUserRole" runat="server" CssClass="literaltext"></asp:Label><br /><br /> 
           <asp:RadioButtonList id="rblstRoleChange" runat="server"> 
            <asp:ListItem selected="true">Add Role to User</asp:ListItem> 
            <asp:ListItem>Remove Role from User</asp:ListItem>          
           </asp:RadioButtonList> 
           <asp:DropDownList ID="ddlUserRoles" CssClass="dropdowns" runat="server" AutoPostBack="True" ClientIDMode="Static" /><br /> 
           <asp:Button ID="submitrolechange" Text="Submit Role Change" CssClass="buttons" runat="server" ClientIDMode="Static" Visible="False" /> 
       </fieldset> 
      </ContentTemplate> 
      <Triggers> 
       <asp:AsyncPostBackTrigger ControlID="ddlSiteUsers" EventName="SelectedIndexChanged"/> 
       <asp:AsyncPostBackTrigger ControlID="submitrolechange" EventName="Click"/> 
      </Triggers> 
     </asp:UpdatePanel> 
</fieldset> 

及以下的JQuery

<script> 
    $(document).ready(function() { 
     $('#ddlSiteUsers').change(function() { 
      $(this).css({ 'color': 'black', 'font-size': '1.1em', 'font-weight': 'bold' }); 
     }); 
     // 

     $('#updplRoleChange select').change(function() { 
      $('#submitrolechange').show(); 
      $(this).css({ 'color': 'black', 'font-size': '1.1em', 'font-weight': 'bold' }); 
     }); 
    }); 
</script> 

第一功能的工作原理，第二個沒有。在使用第一個下拉選擇器後，更新面板中沒有爲標記生成html，所以我甚至不確定選擇器ID是否實際上保持靜態。

Answer 1

一旦更改第二個下拉列表（如設置AutoPostBack="True"），顏色的變化爲粗體然後回發到服務器。

從服務器返回時，它不保持以前的客戶端狀態，這是預期的行爲。

如果你想保持以前的客戶端的狀態，你需要做這樣的頁面加載的東西。

<fieldset style="width: 40%; margin-left: 50px;"> 
    <legend>Site User Role Management</legend> 
    <asp:Label ID="lblSiteUserDDl" runat="server" AssociatedControlID="ddlSiteUsers" 
     Text="Manage the roles in which a user is registered by selecting the user from the dropdown list below."></asp:Label> 
    <asp:DropDownList ID="ddlSiteUsers" runat="server" CssClass="dropdowns" AutoPostBack="True" ClientIDMode="Static"> 
     <asp:ListItem Text="One" Value="One" /> 
     <asp:ListItem Text="Two" Value="Two" /> 
    </asp:DropDownList> 
    <br /> 
    <br /> 
    <asp:UpdatePanel ID="updplRoleChange" runat="server" ClientIDMode="Static"> 
     <ContentTemplate> 
      <fieldset id="rolemanagement" runat="server"> 
       <legend id="rolemgmtlegend" runat="server"></legend> 

       <asp:Label ID="lblCurrentRole" runat="server" CssClass="literaltext"></asp:Label><br /> 
       <asp:Label ID="lblSiteUserRole" runat="server" CssClass="literaltext"></asp:Label><br /> 
       <br /> 
       <asp:RadioButtonList ID="rblstRoleChange" runat="server"> 
        <asp:ListItem Selected="true">Add Role to User</asp:ListItem> 
        <asp:ListItem>Remove Role from User</asp:ListItem> 
       </asp:RadioButtonList> 
       <asp:DropDownList ID="ddlUserRoles" CssClass="dropdowns" runat="server" AutoPostBack="True" 
        ClientIDMode="Static" OnSelectedIndexChanged="ddlUserRoles_SelectedIndexChanged"> 
        <asp:ListItem Text="One" Value="One" /> 
        <asp:ListItem Text="Two" Value="Two" /> 
       </asp:DropDownList> 
       <asp:Button ID="submitrolechange" Text="Submit Role Change" CssClass="buttons" runat="server" ClientIDMode="Static" Visible="False" /> 
      </fieldset> 

     </ContentTemplate> 
     <Triggers> 
      <asp:AsyncPostBackTrigger ControlID="ddlSiteUsers" EventName="SelectedIndexChanged" /> 
      <asp:AsyncPostBackTrigger ControlID="submitrolechange" EventName="Click" /> 
     </Triggers> 
    </asp:UpdatePanel> 
</fieldset> 
<script> 
    $(document).ready(function() { 
     $('#ddlSiteUsers').change(function() { 
      $(this).css({ 'color': 'black', 'font-size': '1.1em', 'font-weight': 'bold' }); 
     }); 
     // 

     $('#updplRoleChange select').change(function() { 
      $('#submitrolechange').show(); 
      $(this).css({ 'color': 'black', 'font-size': '1.1em', 'font-weight': 'bold' }); 
     }); 

    }); 

    function roleChange() { 
     if ($('#updplRoleChange select').val() == "Two") { 
      $('#updplRoleChange select').css({ 'color': 'black', 'font-size': '1.1em', 'font-weight': 'bold' }); 
     } 
    } 
</script> 

protected void ddlUserRoles_SelectedIndexChanged(object sender, EventArgs e) 
{ 
    ScriptManager.RegisterStartupScript(this, GetType(), UniqueID, "roleChange();", true); 
} 

Answer 2

我想你想使用現場像這樣：

$('#updplRoleChange select').live("change", function(e) { 
     // Do something exciting 
});