HTML表追加，JQuery數組

Question

我的頁面上有一個動態表，用戶可以從中添加行/刪除行。假設用戶增加了6個人。第一個名字數組是這樣的：

Index: 0 1 2 3 4 5 
Person#: 1 2 3 4 5 6 

然後假設用戶刪除了前三排，所以後來名字排列是這樣的：

Index: 0 1 2 3 4 5 
Person#:    4 5 6 

最後，用戶將三個人，陣列會是這樣的：

Index: 0 1 2 3 4 5 
Person#:    7 8 9 

這就是我遇到的問題。當刪除行，我怎麼了jQuery陣列適當移動，使得不是這樣看：

Index: 0 1 2 3 4 5 
Person#:    4 5 6 

它會是這樣的：

Index: 0 1 2 3 4 5 
Person#: 4 5 6 

這裏是我的代碼工作的例子： demo
我需要在我的代碼中添加/更改以解決問題？

Answer 1

我通常簡單地重新編號屬性值。事情是這樣的：

$("#table").find('tr').each(function(index, element) 
{ 
    var row = $(this); 

    index --; 

    var names = ['fname_new', 'lname_new', 'phone_new', 'email_new', 'ethnicity_new']; 
    for(var i in names) 
    { 
     row.find('input[name^="' + names[i] + '"]').attr('name', '' + names[i] + '[' + index + ']'); 
    } 
}); 

http://jsbin.com/icutuj/3/edit

Answer 2

我不是試圖修復索引，而是創建一個隱藏變量，讓我們將其稱爲索引，並且每次向索引++添加新行時。

然後，當數據被調回你可以有這樣的事情快僞代碼：

for (int i = 0; i++ i<$index) { 
    var person = $POST[person_$index]; 
    if (person != null) { 
    //do something 
    } 
} 

這樣，你真的不關心他們多少條記錄刪除。

乾杯！

Answer 3

也許不是最好的解決方案，但是我通過消隱行值，然後更改hide（）的delete（）來消除這個問題。並沒有保持行數。希望有更好的解決方案。

$('div#editPhoneDlg').delegate('a.remove[href^=#]', 'click', function() { 

     var row = $(this).parent().parent(); 
     if (rowCount > 1) { 
      var name = $(row).find('td.name input'); 
      name.val(''); 
      var address = $(row).find('td.address input'); 
      address.val(''); 
      var phone = $(row).find('td.phone input'); 
      phone.val(''); 
      row.hide(); 
     } 
     else { 
      var name = $(row).find('td.name input'); 
      name.val(''); 
      var address = $(row).find('td.address input'); 
      address.val(''); 
      var phone = $(row).find('td.phone input'); 
      phone.val(''); 
     } 
     return false; 
    });