2010-08-14 27 views
0

大家好,JQuery的束縛點擊功能成爲綁定與ASP.Net AJAX回發

我有一個綁定到一個ASP一個簡單的jQuery功能:按鈕和火災點擊提交按鈕的時候,像這樣:

<asp:Button ID="btnSubmit" CssClass="btnSubmit" OnClick="btnSubmit_Click" runat="server" 
       Text="Send" /> 

$(document).ready(function() { 
    $(".btnSubmit").click(function() { 
     alert("button clicked"); 
    }); 
}); 

此代碼在第一次加載頁面時正確運行,但在單擊提交(併發生post/postback)後再次運行。 asp按鈕代碼位於UpdatePanel中。看起來好像JQuery代碼在回發之後「未註冊」或未綁定。我頁面上的ScriptManager控件,但是這一切都是我做它:

<asp:ScriptManager ID="ContactFormScriptManager" runat="server"> 
    <Scripts> 
    <asp:ScriptReference Path="Scripts/jquery-1.4.1.js" ScriptMode="Auto" /> 
    <asp:ScriptReference Path="Scripts/contact-form.js" ScriptMode="Auto" /> 
    </Scripts> 
</asp:ScriptManager> 

我懷疑還有更多我需要的ScriptManager做,以確保我的jQuery代碼保持註冊,但我不肯定是什麼。您的建議將不勝感激。

感謝, -NorthK

回答

1

@Sarfraz是正確的關於解決辦法,但我想你可能需要一些解釋,爲什麼這個工程:

$(function() { 
    $(".btnSubmit").live("click", function() { 
    alert("button clicked"); 
    }); 
}); 

這並不是說它「未註冊」,而是UpdatePanel中的元素被完全銷燬/被新元素所取代。由於點擊處理程序存儲在這些元素上(當然,不完全是,但很接近),它不會自動爲新元素創建。然而

.live()原理不同,它增加了一個事件處理程序document未得到更換。它收聽click事件到bubble up the DOM併到達文檔。當它到達時,它檢查事件來自的元素是否與選擇器匹配...如果選擇器匹配,它將執行處理程序。

+1

@Sarfraz和@nick, 非常感謝。這就像一個魅力和解釋幫助很多! – 2010-08-15 01:19:08

0

試試這個:

$(document).ready(function() { 
    $(".btnSubmit").live('click', function() { 
     alert("button clicked"); 
    }); 
});