jQuery的添加/刪除

這個片段做什麼，我希望它有1個例外做。它正常工作，如果用戶按下「添加」一遍又一遍 - 它刪除空行並添加新行。如果用戶在輸入字段中鍵入內容，該字段將轉換爲表格數據。當用戶按下「添加」兩次，第二個「添加」低於第一我唯一的問題是。如果第二個「添加」高於第一個，它就可以工作。jQuery的添加/刪除

我敢肯定，這事做的事實，我刪除行，如果輸入值是空的。

<!DOCTYPE HTML> 
<html> 
<head> 
<script src="http://www.google.com/jsapi"></script> 
<script type="text/javascript"> 
function OnLoad() { 
    $('input[name="myid"]').live('focusout', function() { 
     var myValue = $(this).val(); 
     if (myValue == '') { 
      $(this).parents("tr").remove(); 
     } else { 
      $(this).parents("td").empty().append(myValue); 
     } 
    }); 
    $('.insert').live('click', function() { 
     var currentRow = $(this).parents("tr:first"); 
     var newRow = currentRow.clone(true); 
     newRow.children('td:last').empty().append('<input name="myid" />'); 
     currentRow.after(newRow); 
     document.myForm.myid.focus(); 
    }); 
    $('.delete').live('click', function() { 
     if (confirm("Are you sure?")) { 
      $(this).parents("tr").remove(); 
     } 
    }); 
} 
google.load("jquery", "1"); 
google.setOnLoadCallback(OnLoad); 
</script> 
</head> 
<body> 
<form name="myForm"> 
<table border="1"> 
<tr> 
<td class="insert">Add</td> 
<td class="delete">Erase</td> 
<td>One</td> 
</tr> 
<tr> 
<td class="insert">Add</td> 
<td class="delete">Erase</td> 
<td>Two</td> 
</tr> 
<tr> 
<td class="insert">Add</td> 
<td class="delete">Erase</td> 
<td>Three</td> 
</tr> 
</table> 
<input name="Other"> 

</form> 
</body> 
</html>

來源

2010-02-24 Phillip Senn

發生這種情況，因爲blurclick之前發生，在你的代碼

$(this).parents("tr").remove();

被點擊發生之前執行，所以實際上沒有什麼可點擊（和冒泡觸發.live()事件）。在你的情況下，我會從當前正在添加的行中刪除添加選項。

來源

2010-02-24 22:53:02

好吧，我刪除從當前正在添加的行附加選項。但我仍然有這個問題。由於事件的內容是之前點擊發生的事情，我怎麼能救我需要刪除一次點擊已經插入新行的行的標識？ – 2010-02-25 00:08:39

我想我明白了。感謝您的指導。 – 2010-02-25 00:13:02

jQuery的添加/刪除

回答

相關問題