如何從頁面加載後添加的元素中檢索輸入值？

Question

我與Zend框架1.12工作，我需要能夠動態地從一個子表單添加和刪除字段，在這種情況下，我們的超鏈接到父「促銷」相關聯。

我還沒有找到一種方法來實現動態添加和Zend公司通過刪除元素，和罕見的教程中我發現，聲稱這樣做是半個十年前，當我嘗試他們不工作。

所以我在做什麼是存儲我需要一個Zend隱藏的輸入字段一起工作，然後用JSON數據處理我提交後的鏈接。效率不高，但這是我迄今爲止唯一的工作。

下面是我的工作的一段代碼：

假設像一種形式：

<form action="/promos/edit/promo_id/15" method="POST" id="form_edit"> 
    <!-- input is Zend_Form_Element_Hidden --> 
    <input type="hidden" id="link_array" value="{ contains the JSON string }"/> 

    <button id="add_link">Add Link</button> 
</form> 

的目的是，每次添加鏈接按鈕被按下時，表單字段添加以允許用戶輸入將與特定項目相關聯的新超鏈接。

這裏的功能：

// add links 
$('#add_link').click(
    function(e) { 
     e.preventDefault(); 
     link = '<div class="p_link new_link">' + 
        '<div class="element_wrap">' + 
        '<label for="link_name" class="form_label optional">Text: </label>' + 
        '<input type="text" id="new_link_name" name="link_name"/>' + 
        '</div>' + 
        '<div class="element_wrap">' + 
        '<label for="link_http" class="form_label optional">http://</label>' + 
        '<input type="text" id="new_link_http" name="link_http"/>' + 
        '</div>' + 
        '<div class="element_wrap">' + 
        '<button class="submit delete_link">Delete</button>' + 
        '</div>' + 
       '</div>'; 

     $('#add_link').prev().after(link); 
    } 
); 

現在，我需要做的是在提交，對每一位new_link類元素，採取鏈接名稱和HTTP參考，並放置在一個JSON對象。下面的代碼，因爲我有這麼遠（我知道我沒有在這點表示兩個輸入空格）：

$('#submit').click(
    function(e) { 
     e.preventDefault(); 
     var link_array = []; 

     var new_links = document.getElementsByClassName('new_link'); 
     $.each(new_links, function() { 
      console.log(this); 
      var n = $(this).children('#new_link_name').text(); 
      console.log(n); 
      link_array.push({'link_name':n}); //'link_http':h 
     }); 
     console.log(JSON.stringify(link_array)); 
    } 
); 

我的問題是：var new_links = document.getElementsByClassName('new_link');將收集所有新加入的new_link元素，但它不會拉入任何已輸入到文本字段的值。

我需要知道我如何明顯地綁定我對輸入字段的值屬性所做的任何輸入，因爲現在我輸入到這些新元素中的任何內容都會被拋出，並且只有當字段看起來爲空時。

Answer 1

$('#submit').click(
    function(e) { 
     e.preventDefault(); 
     var link_array = []; 

     var new_links = $('.new_link'); 
     $.each(new_links, function() { 
      console.log(this); 
      var n = $(this).find('input').val(); // you need input values! This line //is changed... 
      console.log(n); 
      link_array.push({'link_name':n}); //'link_http':h 
     }); 
     console.log(JSON.stringify(link_array)); 
    } 
); 

的jsfiddle：http://jsfiddle.net/DZuLJ/

編輯：不能有多個IDS（使類每個輸入和目標類，如果你想鏈接的名稱和HTTP的）