如何從動態添加（使用JavaScript）元素獲取值？

在我的aspx頁面上，我使用javascript動態地在客戶端創建html控件。例如，頁面加載後，您可以單擊瀏覽器中的按鈕，通過單擊按鈕html 輸入和選擇元素出現。您可以再次點擊，並且此元素（輸入和選擇）將再次添加。所以，你可以創建如此多的輸入和選擇，只要你想（所有這些使用JavaScript，沒有回傳）如何從動態添加（使用JavaScript）元素獲取值？

在用戶創建了一些輸入並選擇並輸入了一些信息後，他發佈了表單。我想在服務器端查找所有這些動態添加的元素，並執行一些操作取決於此控件中的值。

如何找到動態添加的元素，以及實現此目的的最佳和最優雅的方法是什麼？

在此先感謝。

來源

2011-08-09 Kai

你張貼到相同的頁面，或者是你張貼到另一個網頁？發佈表單後，您的控件是否仍然存在？ –

我發佈到同一頁面，發佈後我的控件必須仍在頁面上 – Kai

在創建該新元素的Javascript，每次創建一個元件時使計數器遞增。將計數器的值添加到輸入元素的名稱中，以便每個元素具有唯一的名稱。

當表單發佈時，將計數器的最終值添加到隱藏表單域。

在您的服務器端代碼中，創建一個從零開始的循環並繼續，直到達到計數器的值。在循環中，獲取相應表單字段的發佈值。

來源

2011-08-09 18:25:08

創建循環遍歷每個input和select對象，該對象抓取當前對象的名稱/ id及其相應的值。然後將這些項目添加到數組中，一旦循環完成，將這些值傳遞給您的aspx文件。

您可以使用此方法查看示例：http://jsfiddle.net/euHeX/。它目前只提醒這些值，但是您可以輕鬆修改它以將值作爲參數通過ajax傳遞給您的處理程序aspx文件。代碼將根據提供的輸入添加新的輸入或選擇框。這當然會被修改以反映您當前的設置。

HTML：

<div id="dynamic"></div> 
<input type="button" id="submit-form" value="Submit>>">

的JavaScript（使用jQuery）：

function createInput(type){ 
    for(var i=0; i<5; i++){ 
     if(type==0){ 
      var obj = '<input type="text" id="'+i+'" class="dynamicContent">'; 
     }else if(type==1){ 
      var obj = '<select id="'+i+'" class="dynamicContent"><option>--Select--</option></select>'; 
     } 
     $("#dynamic").append(obj); 
    } 
} 

function getContent(){ 
    var inputArray = []; 
    $(".dynamicContent").each(function(k,v){ 
     var o = $(this); 
     var oType; 
     if(o.is("input")){ oType = "input"; } 
     if(o.is("select")){ oType = "select"; }   
     var oID = oType+o.attr("id"); 
     var oValue = o.val(); 
     inputArray.push(oID+'='+oValue); 
    }); 
    alert(inputArray); 
} 

$("#submit-form").click(function(){ 
    getContent();  
}); 

// Set type to 0 for input or 1 for select 
var type = '1'; 
createInput(type);

來源

2011-08-09 18:24:27 RobB

添加元素時，爲其分配唯一的ID，然後使用Request.Form [「UniqueIdHere」]（C＃）或Request.Form（「UniqueIdHere」）（VB.NET）檢索它們的值。

來源

2011-08-09 18:25:37

如果您使用的是jQuery，您可以使用.live()來實現這一點，就像一塊蛋糕！ http://api.jquery.com/live/

來源

2011-08-09 18:25:42 Mohsen

我不知道，如果你的控制將生存的回傳你正在創建它們的方式，但是對於訪問動態生成控件（假設你已經找到了如何堅持他們）一個很好的方法是請執行以下操作：

將面板添加到您的頁面。將您的動態創建的控件添加到此面板。

在onclick事件處理程序（或其他方式），這樣做的以下內容：

foreach (DropDownList ddl in Panel1.Controls.OfType<DropDownList>()) 
{ 
    //put code here 
} 

foreach (TextBox txt in Panel1.Controls.OfType<TextBox>()) 
{ 
    //put code here 
}

來源

2011-08-09 18:29:24

如何從動態添加（使用JavaScript）元素獲取值？

回答

相關問題