在UpdatePanel中第二次不触发Jquery Click事件

时间:2013-08-24 16:50:03

标签: jquery asp.net

我的主题是显示一个div显示消息“Saved Successfully ..”并在2秒后自动隐藏 我做了几乎所有的事情,一切正常,但只有第一次点击。在第二次单击时,它仅显示DIV消息enter code here“已成功保存...”但不执行查询。 我在互联网上搜索了很多但发现什么都没有用完。我的代码是:

<script type='text/javascript' src='http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js'>
    </script> 
    <script type="text/javascript">
    $(document).ready(function () { 
        var prm = Sys.WebForms.PageRequestManager.getInstance();
        prm.add_endRequest(function () { // re-bind your jquery events here
            $("#btn_Save").click(function (e) {
            e.preventDefault();
            $('#showMessage').fadeIn(100);
            setTimeout(function () { $('#showMessage').fadeOut(500); }, 2000);
            })
        })
     })
    </script

&GT;

<form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">  
            <ContentTemplate>
                <div id="msg" style="display:none" ><p>Saved Successfully...</p></div>                                         <div>
        <asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click"/>        
        </div
            <div id="showMessage" style="display:none;"><p>Saved Successfully...</p>   </div>  
            </ContentTemplate> 
                <Triggers >
                  <%--<asp:AsyncPostBackTrigger ControlID="Button1" />--%>
                </Triggers>
        </asp:UpdatePanel>
</form>

protected void btn_Save_Click(object sender, EventArgs e)
{
   //Query to save data into database

}

1 个答案:

答案 0 :(得分:0)

最初在document.ready中绑定事件并在外部重新绑定:

<script type="text/javascript">
    $(document).ready(function () {
            $("#btn_Save").click(function (e) {
            e.preventDefault();
            $('#showMessage').fadeIn(100);
            setTimeout(function () { $('#showMessage').fadeOut(500); }, 2000);
            })

    })

    var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_endRequest(function () { // re-bind your jquery events here
        $("#btn_Save").click(function (e) {
        e.preventDefault();
        $('#showMessage').fadeIn(100);
        setTimeout(function () { $('#showMessage').fadeOut(500); }, 2000);
        })
    })

</script>

这篇文章可能有所帮助:jQuery $(document).ready and UpdatePanels?