點擊動態添加按鈕時，如何激發一個aspx腳本？

我建立一個.aspx頁面，允許用戶管理我們的服務器上的一些xml文件。頁面內容使用AJAX加載，因此按鈕和表單將動態添加到文檔中。

如果我在客戶端的機器上加載之前在.aspx頁面中創建了靜態按鈕，我可以非常輕鬆地將一個事件附加到該按鈕上。但是，我使用jQuery動態添加和刪除按鈕和表單。

下面是一個簡單的例子：

在下面的jsfiddle，我假裝HTML文檔包含以下腳本：

<script language="C#" type="text/C#" runat="server"> 
void SaveAllChanges(Object sender, EventArgs e) 
{ 
    Button clickedButton = (Button)sender; 
    clickedButton.Text = "foobar"; 
} 
</script>

而且我有一個JavaScript文件，其中包含以下：

$('button.buttonGenerator').click(function() { 

    $('.buttonContainer').append(
     '<button onclick="SaveAllChanges">' + 
     'Save All Changes!' + 
     '</button>' 
    ); 

});

顯然，我創建的按鈕不能用現在的方式運行函數SaveAllChanges。我添加了onclick屬性，以僞代碼樣式顯示我需要發生的事情。

我該如何做到這一點，使動態添加的按鈕可以運行我在文檔頂部的腳本標記中定義的C＃方法？

這裏是的jsfiddle：http://jsfiddle.net/2XwRJ/

感謝。

來源

2012-08-10 bdrelling

您可以給所有必須保存更改的按鈕設置一個常用類（例如class =「ajaxButton」），並且有一個jQuery方法響應與該類匹配的元素上的點擊事件（使用live，以便更新DOM ）。

$("button.ajaxButton").live("click", function(){ 
    // Perform your Ajax callback to run server-side code 
});

來源

2012-08-10 20:21:07

live（）從jQuery 1.7開始已棄用。（'click'）; – sent1nel 2012-08-10 20:24:06

這不是問題的jQuery代碼。它實際上將.ajax（）方法與我的服務器上的aspx腳本連接起來。 – bdrelling 2012-08-10 21:26:00

你需要做的就是使用類似..

$(document).ready(function() { 
    $('button.buttonGenerator').click(function() { 
    $('.buttonContainer').append(
     '<button id="#dynamicCommentButton" onclick="SaveAllChanges">' + 
     'Save All Changes!' + 
     '</button>' 
    ); 
    }); 
    $(document).on('click', '#dynamicCommentButton', function() { 
    alert($(this).attr('id')); 
    }); 
});

來源

2012-08-10 20:23:28 sent1nel

對不起，如果我不明白，但這是如何幫助我在我的服務器上運行一個aspx腳本，而不僅僅是分配一個函數的ID？我知道jQuery應該如何工作，但我不知道如何設置我的代碼以將數據發送到我的服務器上的aspx腳本。 – bdrelling 2012-08-10 21:26:33

噢，對不起，您的問題（「我怎樣才能讓它動態添加按鈕可以運行我在文檔頂部腳本標記中定義的C＃方法？」）稍微含糊不清。讓一個AJAX調用傳遞變量被保存？否則，我會說使用websockets。 http://stackoverflow.com/questions/8492940/jquery-ajax-post-using-asp-net – sent1nel 2012-08-11 03:19:34

你是不是要能夠添加按鈕，就像你擁有了它有如下的代碼只是將其作爲一個HTML DOM元素和onclick屬性將成爲客戶端元素。其結果是，單擊按鈕將會嘗試火SaveAllChanges javascript函數

$('.buttonContainer').append(
     '<button onclick="SaveAllChanges">' + 
     'Save All Changes!' + 
     '</button>' 
);

將是最好什麼是創造的JavaScript SaveAllChanges功能，那麼你可以從那裏處理它。我看你能做到這一點的方法有兩種：

有一個HTTP端點設置（腳本服務，Web API或只是張貼到網頁），您調用使用Ajax從您的JavaScript。然後你可以通過任何需要的參數。
你可以在頁面上有一個隱藏的元素和隱藏的按鈕，這樣當調用javascript時，它會填充你需要的任何參數，然後單擊隱藏的按鈕並將頁面返回。

就我個人而言，我會從用戶體驗的角度來選擇第一種方法，因爲頁面不會每次回發。我使用了類似於第二種方法的東西，它工作正常，但感覺非常笨重。

來源

2012-08-11 14:59:07

點擊動態添加按鈕時，如何激發一個aspx腳本？

回答

相關問題